Has anyone got Google Charts to work? | XM Community
Skip to main content
Question

Has anyone got Google Charts to work?

  • March 11, 2020
  • 1 reply
  • 59 views

In our survey, we are collecting some data, and then, later on, we ask some survey questions about the data. I've been trying to display that data in a chart before the question using some javascript. So far, no joy whatsoever. I've attached the following into the Survey Header (using Look+Feel html editor): "script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"/script script google.charts.load('current', {packages: ['corechart']}); /script" (deleted the slashes in above) And then into the individual question: Qualtrics.SurveyEngine.addOnload(function() { var iDiv = document.createElement('div'); iDiv.id = 'chart_div'; iDiv.className = 'chart_div'; document.body.appendChild(iDiv); google.charts.setOnLoadCallback(drawChart); function drawChart() { // usual code to create the chart // var chart = new google.visualization.PieChart(document.getElementById('chart_div')); chart.draw(data, options); } }); Not sure where to start really. The code does run (I tested using an alert). I'm not sure that the google charts library is loading correctly - using developer tools, I can't see that the script has been added to the header. Similarly with the 'div' I tried to create . Looks like this is something to do with dynamic loading? Any ideas / examples of where people have got this to work would be gratefully received. Thanks, Phil

1 reply

  • Author
  • March 11, 2020
Update, I've now got a chart to appear. However, the same chart appears on every page, not just against the single question I want it to appear alongside: Qualtrics.SurveyEngine.addOnload(function() { var iDiv = document.createElement('div'); iDiv.id = 'chart_div'; iDiv.className = 'chart_div'; document.body.appendChild(iDiv); google.charts.setOnLoadCallback(drawChart); function drawChart() { // usual code to create the chart // var chart = new google.visualization.PieChart(document.getElementById('chart_div')); chart.draw(data, options); }