Uncaught ReferenceError: google is not defined (Google Chart)

Question

我是 require.js 的新手。我正在尝试显示 Google 饼图。我可以在我的 JSFiddle.

中使用它

问题

然后，当我将它们移动到我的实际项目中时，它不起作用。我的真实项目使用 require.js

在我的道路上，我是这样声明的

'piechart' : 'reports/section-exercise/piechart',

在我的 piechart.js 中，我是这样的：

'use strict';

define(['jquery' ], function ($) {

  $(function () {

    google.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = google.visualization.arrayToDataTable([
        ['Task', 'Hours per Day'],
        ['l', 23],
        ['m', 30],
        ['h', 47],

        ]);

      var options = {
        width: 200,
        height: 200,
        chartArea: {
          left: 10,
          top: 20,
          width: "100%",
          height: "100%"
        },
        colors: ['#F46E4E', '#ADB55E', '#F9C262'],
        legend: 'none',
        enableInteractivity: false,
        pieSliceText: 'none',

      };

      var chart = new google.visualization.PieChart(document.getElementById('piechart'));

      chart.draw(data, options);
    }

  });

});

包括

我将这个 link 添加到我的 HTML 文件

 <link rel="stylesheet" type="text/css" href="https://www.google.com/jsapi?autoload={%27modules%27:[{%27name%27:%27visualization%27,%27version%27:%271.1%27,%27packages%27:[%27corechart%27]}]}">

结果

错误信息

然后，当我点击右边的文件时，它会将我重定向到这一行：

如何停止该错误并再次显示我的图表？

我的 include link 怎么样？我在 JSFiddle 中使用了与 外部资源 相同的一个，它有效。

Answer 1

您需要将 URL 包含为 JavaScript，但您将其包含为 CSS。你需要这个：

<script src="..."></script>

而不是这个：

<link rel="stylesheet" type="text/css" href="...">

Uncaught ReferenceError: google is not defined (Google Chart)

Uncaught ReferenceError: google is not defined (Google Chart)

javascript

css

jquery

require

google-visualization

问题

包括

结果

错误信息