app.js (1984B)
1 $(document).ready(function(){ 2 var queryValues = location.search; 3 $.ajax({ 4 url: "https://surveyseahorse.com/res/query.php" + queryValues, 5 method: "GET", 6 success: function(data) { 7 console.log(data); 8 var question = []; 9 var answer = []; 10 var num_ans = []; 11 var rand_clr = []; 12 13 var dynamicColors = function() { 14 var r = Math.floor(Math.random() * 255); 15 var g = Math.floor(Math.random() * 255); 16 var b = Math.floor(Math.random() * 255); 17 var a = 0.3; 18 return "rgb(" + r + "," + g + "," + b + "," + a + ")"; 19 }; 20 21 for(var i in data) { 22 question.push("Question " + data[i].question_number); 23 answer.push(data[i].answer); 24 num_ans.push(data[i].num_ans); 25 rand_clr.push(dynamicColors()); 26 } 27 28 var chartdata = { 29 labels: answer, 30 datasets : [ 31 { 32 label: 'Answer Frequency', 33 backgroundColor: rand_clr, 34 borderColor: 'rgba(200, 200, 200, 0.75)', 35 //hoverBackgroundColor: 'rgba(200, 200, 200, 1)', 36 hoverBorderColor: 'rgba(200, 200, 200, 1)', 37 data: num_ans 38 } 39 ] 40 }; 41 42 var ctx = $("#mycanvas"); 43 44 var barGraph = new Chart(ctx, { 45 type: 'polarArea', 46 data: chartdata, 47 options: { 48 title: { 49 display: true, 50 text: 'Overall Distribution Of Answers for Question' + window.location.search.substr(1) 51 } 52 } 53 }); 54 }, 55 error: function(data) { 56 console.log(data); 57 } 58 }); 59 });