How can I gather URL parameters to use in a pie chart?

• October 28, 2016 at 10:56 pm #13073
  
  DavisB

  I am trying to gather data stored in URL and display them in the pie chart.
  I’m fairly new to this so I decided to ask around to see if I can get some help.
  I have a form and when it’s submitted it has the values of each question in the URL.

  Is there a way I can gather the data from the URL and use that data in the canvasjs pie chart?

  Kind Regards,

  Brandon

  October 29, 2016 at 11:20 am #13076
  
  Vishwas R

  Brandon,

  Please refer window.location object for more info about your requirement.

  November 3, 2016 at 8:15 pm #13179
  
  DavisB

  Thank you Vishwas. I will look into window.location object.

  November 3, 2016 at 9:13 pm #13181
  
  DavisB

  This is my query string I am trying to gather the data from: ?q1=0&q2=75&q3=25&q4=25&q5=50&q6=75&q7=25&q8=50&q9=0&q10=100&q11=75&q12=0&q13=0&q14=50&q15=25&q16=25&q17=75&q18=0&q19=25&q20=0&q21=50

  I want to gather just the Number values and then average them into a canvas js pie chart. for some reason I can’t seem to get just the values.

  Any suggestions?

  November 4, 2016 at 6:33 pm #13203
  
  Bivek Singh

  DavisB,

  Please refer this jsFiddle

  I’ve used URL as a string variable but you can fetch it from URL using location.search i.e.

  var url = location.search;

  Bivek,
  Team CanvasJS

  November 9, 2016 at 12:58 am #13282
  
  DavisB

  Thanks you Bivek that worked perfectly.

  November 10, 2016 at 11:40 pm #13307
  
  DavisB

  One last question. I’m trying to get the average of 3 questions values from the users radio button selection. Each section on the survey I’m making has 3 questions with 5 answers to choose from. Each answer has a value associated with it that I gather from the URL. Is it a way I can separate the answers out by threes, add them up and average them out to get the value I need to show on the pie chart.

  I’ll try to show a snippet of my code that I have so

  <div id=”physical_group” class=”group”>
  <h3 class=”group_title”>Physical</h3>
  <ul class=”responce_header”>
  <li>Never</li>
  <li>Rarely</li>
  <li>Sometimes</li>
  <li>Often</li>
  <li>Always</li>
  </ul>
  <div class=”question”>
  <div class=”errors”>
  <ul class=”errorlist”>
  </ul>

  </div>
  <p class=”label”>
  <span class=”enum”>1.</span>
  <label for=”id_q1_0″>I eat a balanced nutritional diet</label>
  </p>
  <div class=”choices”>
  <ul id=”id_q1″>
  <li>
  <input id=”id_q1_1″ name=”q1″ value=”0″ type=”radio”/>
  <label for=”id_q1_1″>
  <span class=”label_text”>Never</span>
  </label>
  </li>
  <li>
  <input id=”id_q1_2″ name=”q1″ value=”25″ type=”radio”/>
  <label for=”id_q1_2″>
  <span class=”label_text”>Rarely</span>
  </label>
  </li>
  <li>
  <input id=”id_q1_3″ name=”q1″ value=”50″ type=”radio”/>
  <label for=”id_q1_3″>
  <span class=”label_text”>Sometimes</span>
  </label>
  </li>
  <li>
  <input id=”id_q1_4″ name=”q1″ value=”75″ type=”radio”/>
  <label for=”id_q1_4″>
  <span class=”label_text”>Often</span>
  </label>
  </li>
  <li>
  <input id=”id_q1_5″ name=”q1″ value=”100″ type=”radio”/>
  <label for=”id_q1_5″>
  <span class=”label_text”>Always</span>
  </label>

  <span class=”enum”>2.</span>
  <label for=”id_q2_0″>I eat regular nutritious meals that give me the energy I need to get through the day.</label>
  </p>
  <div class=”choices”>
  <ul id=”id_q2″>
  <li>
  <input id=”id_q2_1″ name=”q2″ value=”0″ type=”radio”/>
  <label for=”id_q2_1″>
  <span class=”label_text”>Never</span>
  </label>
  </li>
  <li>
  <input id=”id_q2_2″ name=”q2″ value=”25″ type=”radio”/>
  <label for=”id_q2_2″>
  <span class=”label_text”>Rarely</span>
  </label>
  </li>
  <li>
  <input id=”id_q2_3″ name=”q2″ value=”50″ type=”radio”/>
  <label for=”id_q2_3″>
  <span class=”label_text”>Sometimes</span>
  </label>
  </li>
  <li>
  <input id=”id_q2_4″ name=”q2″ value=”75″ type=”radio”/>
  <label for=”id_q2_4″>
  <span class=”label_text”>Often</span>
  </label>
  </li>
  <li>
  <input id=”id_q2_5″ name=”q2″ value=”100″ type=”radio”/>
  <label for=”id_q2_5″>
  <span class=”label_text”>Always</span>
  </label>
  </li>
  </ul>
  </div>
  </div>
  <div class=”question”>
  <div class=”errors”></div>
  <p class=”label”>
  <span class=”enum”>3.</span>
  <label for=”id_q3_0″>I choose to abstain from sex or sex is enjoyable and I practice safe sex.</label>
  </p>
  <div class=”choices”>
  <ul id=”id_q3″>
  <li>
  <input id=”id_q3_1″ name=”q3″ value=”0″ type=”radio”/>
  <label for=”id_q3_1″>
  <span class=”label_text”>Never</span>
  </label>
  </li>
  <li>
  <input id=”id_q3_2″ name=”q3″ value=”25″ type=”radio”/>
  <label for=”id_q3_2″>
  <span class=”label_text”>Rarely</span>
  </label>
  </li>
  <li>
  <input id=”id_q3_3″ name=”q3″ value=”50″ type=”radio”/>
  <label for=”id_q3_3″>
  <span class=”label_text”>Sometimes</span>
  </label>
  </li>
  <li>
  <input id=”id_q3_4″ name=”q3″ value=”75″ type=”radio”/>
  <label for=”id_q3_4″>
  <span class=”label_text”>Often</span>
  </label>
  </li>
  <li>
  <input id=”id_q3_5″ name=”q3″ value=”100″ type=”radio”/>
  <label for=”id_q3_5″>
  <span class=”label_text”>Always</span>
  </label>
  </li>
  </ul>
  </div>
  </div>
  </div>

  If you need any more explanation please let me know.
  Thanks in advance.

  November 14, 2016 at 4:46 pm #13327
  
  Bivek Singh

  DavisB,

  Please take a look at this jsfiddle.