有一个错误对我来说很难解决,但我设法将其范围缩小到可以重现的简单步骤。
1) 前往https://developers.google.com/chart/interactive/docs/gallery/geochart https://developers.google.com/chart/interactive/docs/gallery/geochart
2) 将第一个 GeoChart 示例复制粘贴到桌面上的文件中
3)添加国家苏丹和南苏丹并保存文件为mygeochart.html
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['geochart']});
google.charts.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Germany', 200],
['United States', 300],
['Brazil', 400],
['Canada', 500],
['France', 600],
['RU', 700],
['Sudan', 700],
['South Sudan', 700]
]);
var options = {};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="regions_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
什么有效
如果双击 HTML 文件,上述代码将起作用,您将看到苏丹和南苏丹都以绿色显示。
我还可以确认此代码可以在 JSFiddle.net 上运行。
与 ASP.NET 结合时什么不起作用
我检查了 VS 2015 update 3 上的 ASP.NET Full 框架和 ASP.NET Core 中是否出现下面描述的问题,无论所选模板是空还是 MVC Web 应用程序以及 .Net 4.5.1 和 4.6.1。空模板可以让您缩小问题范围。
只需创建一个空项目并将上述 HTML 文件放入解决方案文件夹中,运行网站并转到该页面http://localhost:xxxxx/mygeochart.html http://localhost:xxxxx/mygeochart.html
该页面将正确显示,但南苏丹除外,南苏丹保持白色,就好像没有数据一样。
我在生产网站上遇到这个问题,下面的国家也有这个问题。
['South Sudan', 700],
['Kosovo', 700],
['Democratic Republic of the Congo', 700],
['Congo', 700]
如果双击 HTML 文件,这些国家/地区会显示得很好,但当包含在 ASP.NET 项目中时,这些国家/地区将不会显示。我检查了这个错误发生在 Firefox、IE、EDGE 和 Chrome 浏览器上,并且根据 WhiteHat 的建议,无论 google 可视化版本如何(“当前”、“即将推出”和版本“41”到“45”),该错误也会发生。
我们正在生产网站上运行 GeoChart,但我们很难解决这个问题。
任何想法?