Search code examples
google-visualizationgoogle-sites

Google Sites and Google Chart Tools


I'm trying to include a Google Chart Tools dashboard in a Google Site.

The problem is what code to include in Google Site's html box. I've tried different variations using the code below, but I keep getting

failed to load external URL jsapi

The code works perfectly inside an html file loaded directly, but not in Google Site's html box.

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     11],
          ['Eat',      2],
          ['Commute',  2],
          ['Watch TV', 2],
          ['Sleep',    7]
        ]);

        var options = {
          title: 'My Daily Activities'
        };

        var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

Solution

  • You might want to try this with app script:

    "Currently, Google Sites does not allow the use of JavaScript, iFrames or CSS tags because the use of these languages could leave your site open to security risks. If not protected against, these forms of code could allow people to insert malicious code that could harm you or visitors to your site."