Question

我在页面中包含2个图表，其中一个是使用Google图表的条形图和量表。条形图显示完美，但无论我如何调整代码，都不会显示“量表”图。

这些是我包含的javascript

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="https://apis.google.com/js/platform.js?onload=myFunc" async defer></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

这是显示图表的Java脚本代码。我正在从数据库中获取要显示的数据。

 <script type="text/javascript">
    // Global variable to hold data
    google.charts.load('current', { 'packages': ['corechart'] });
    google.charts.setOnLoadCallback(drawChart);

</script>
<script type="text/javascript">
    $(function () {
        $.ajax({
            type: 'POST',
            dataType: 'json',
            contentType: 'application/json',
            url: 'pageUtamaDataEntry.aspx/GetChartData',
            data: '{}',
            success:
                function (response) {
                    drawchart(response.d);
                },

            error: function () {
                alert("Error loading data! Please try again.");
            }
        });
    })

    function drawchart(dataValues) {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'BranchName');
        data.addColumn('number', 'TotalDelivery');


        data.addRow([dataValues[0].BranchName, 
        dataValues[0].TotalDelivery]);

        var barchart_options = { title: 'Rekapitulasi Pendapatan tahun berjalan',
            vAxis: { title: 'BranchName' },
            hAxis: { title: 'TotalDelivery' },
            width: 550,
            height: 400,
            legend: 'none',
            seriesType: 'bars',
            series: { 5: { type: 'line'} }
        };
        var barchart = new google.visualization.ColumnChart(document.getElementById('barchart_div'));
        barchart.draw(data, barchart_options);


        var gauge_options= { title: 'whatsoever',
        width: 400, height: 120,
        redFrom: 90, redTo: 100,
        yellowFrom:75, yellowTo: 90,
        minorTicks: 5
        };

        var gaugechart = new google.visualization.Gauge(document.getElementById('chart_div'));
        gaugechart.draw(data, gauge_options);

        setInterval(function () {
            data.setValue(0, 1, 40 + Math.round(60 * Math.random()));
            chart.draw(data, options);
        }, 13000);
        setInterval(function () {
            data.setValue(1, 1, 40 + Math.round(60 * Math.random()));
            chart.draw(data, options);
        }, 5000);
        setInterval(function () {
            data.setValue(2, 1, 60 + Math.round(20 * Math.random()));
            chart.draw(data, options);
        }, 26000);

    }

</script>

当我调试javascript时说

未捕获的TypeError：google.visualization.Gauge不是构造函数

谢谢您的时间

Answer 1

在使用之前，您需要加载压力表图表类型。更改以下行

verts = list(zip([-10.,10.,10.,-10],[-5.,-5.,5.,5]))
ax.scatter([0.5,1.0],[1.0,2.0], marker=(verts,0))

到

google.charts.load('current', { 'packages': ['corechart'] });

Google图表计量器未显示，TypeError：google.visualization.Gauge不是构造函数

1 个答案: