jsapi 在 visual studio 2015 年不工作

Question

<script src="../BootStrapFiles/jsapi" type="text/javascript"></script>     
<script type="text/javascript">
    google.load('visualization', '1', { packages: ['corechart'] });
    // google.load('visualization', '1.1', { 'packages': ['bar'] });
</script>  
<script type="text/javascript">
    $(function () {
        $.ajax({
            type: 'POST',
            dataType: 'json',
            contentType: 'application/json',
            url: 'Default.aspx/GetChartData',
            data: '{}',
            success:
            function (response) {
                drawchart(response.d);
            },

            error: function () {
                alert("Error loading data!");
            }
        });
    })
    function drawchart(dataValues) {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Year');
        data.addColumn('number', 'Total amount');
        //   data.addColumn('string', 'Total amount2');

        for (var i = 0; i < dataValues.length; i++) {
            // data.addRows([dataValues[i].Year, dataValues[i].Total], dataValues[i].Year);
            data.addRow([dataValues[i].Year, dataValues[i].Total]);
        }

        //   new google.visualization.PieChart
        //  new google.visualization.BarChart(  //LineChart  //ColumnChart  //ComboChart
        new google.visualization.PieChart(document.getElementById('myChartDivPie')).
        draw(data, { title: "Sales Pie chart last 8 days " });

        new google.visualization.ColumnChart(document.getElementById('myChartDiv')).
        draw(data, { title: "Sales Column chart last 8 days " });

    }  
</script>

这是我在 visual studio 2010 年运行时编写的代码，它运行非常完美。但是当尝试运行 on visual studio 2015 图表时没有出现。你能帮我看看我做错了什么吗？是版本问题还是其他什么？我的代码是在 visual studio 2010 年开发的。一切正常，但图表不可见。

Answer 1

第一个：有一个callback与load语句相关

你不应该尝试使用 google.visualization 命名空间，直到 callback 被触发...

请参阅以下代码片段...

<script src="../BootStrapFiles/jsapi" type="text/javascript"></script>
<script type="text/javascript">
    google.load('visualization', '1', {
      // set callback
      callback: getData,
      packages: ['corechart']
    });
</script>
<script type="text/javascript">
    // load google first
    function getData() {
      $.ajax({
          type: 'POST',
          dataType: 'json',
          contentType: 'application/json',
          url: 'Default.aspx/GetChartData',
          data: '{}',
          success:
          function (response) {
              drawchart(response.d);
          },

          error: function () {
              alert("Error loading data!");
          }
      });
    }
    function drawchart(dataValues) {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Year');
        data.addColumn('number', 'Total amount');
        //   data.addColumn('string', 'Total amount2');

        for (var i = 0; i < dataValues.length; i++) {
            // data.addRows([dataValues[i].Year, dataValues[i].Total], dataValues[i].Year);
            data.addRow([dataValues[i].Year, dataValues[i].Total]);
        }

        //   new google.visualization.PieChart
        //  new google.visualization.BarChart(  //LineChart  //ColumnChart  //ComboChart
        new google.visualization.PieChart(document.getElementById('myChartDivPie')).
        draw(data, { title: "Sales Pie chart last 8 days " });

        new google.visualization.ColumnChart(document.getElementById('myChartDiv')).
        draw(data, { title: "Sales Column chart last 8 days " });

    }
</script>

next：推荐使用loader.js，而不是jsapi

根据 release notes...

The version of Google Charts that remains available via the jsapi loader is no longer being updated consistently. Please use the new gstatic loader from now on.

似乎库已下载到本地文件夹

可以在这里找到更新的库...

<script src="https://www.gstatic.com/charts/loader.js"></script>

这只会改变 load 语句...

    google.charts.load('current', {
      // set callback
      callback: getData,
      packages: ['bar']
    });

jsapi 在 visual studio 2015 年不工作

jsapi is not working in visual studio 2015

asp.net

ajax

google-visualization

jsapi