index_charts.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>

<body>

  <div id="id_prueba"></div>


  <script type="application/javascript">

    (function(f, b) {
      var CHARTS;
      
      var c = f.createElement(b),
        e = f.getElementsByTagName(b)[0];
      c.src = "https://cdn.dev.lacnic.net/require.js";
      c.type = "text/javascript";
      e.parentNode.insertBefore(c, e);
      c.onload = c.onreadystatechange = function() {
        // Require libraries loaded
        requirejs.config({
          "paths": {
            "charts": "charts",
            "jsapi": "https://www.gstatic.com/charts/loader",
            "jquery": "https://cdn.dev.lacnic.net/jquery-1.11.1.min"
          }
        });

        if (typeof google != 'undefined' && typeof google.charts != 'undefined') {
          require(["charts", "jquery"], function(ASYNC_CHARTS, $) {
            onLoad(ASYNC_CHARTS);
          });
        } else {
          require(["charts", "jquery", "jsapi"], function(ASYNC_CHARTS, $) {
            onLoad(ASYNC_CHARTS);
          });
        }

        var onLoad = function(ASYNC_CHARTS) {

          CHARTS = ASYNC_CHARTS;
          CHARTS.draw({
            x: [1, 2, 3, 4, 5],
            ys: [
              [1, 2, 3, 4, 5]
            ],
            labels: ['eje'],
            kind: 'ColumnChart',
            divId: 'id_prueba',
            colors: ['yellow']

          });
        }


      }
    }(document, "script"));
  </script>

</body>

</html>