我有一个 angularjs 应用程序,我使用 ng-google-chart 指令在其上绘制谷歌图表。这里的问题是这样的:
我正在使用以下代码`function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Germany', 200],
['United States', 300],
['Brazil', 400],
['Canada', 500],
['France', 600],
['RU', 700]
]);
var options = {};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}`
当我尝试使用 fiddle 而不是我的应用程序时,效果非常好。我知道这是一个模糊的问题,可能是我的应用程序所特有的。但如果有人从他们的脑海中得到了一些东西,或者以前经历过这种情况,如果你能分享一些东西,那将会有很大的帮助。 提前致谢。
最佳答案
问题出在 head 部分的
<!DOCTYPE html>
<html>
<head>
<base href="/">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://www.google.com/jsapi"></script>
</head>
<body>
<div id="chart" style="height:500px;width:900px;"></div>
<script type="text/javascript">
google.load("visualization", "1", {
callback: function () {
function fixGoogleCharts(element) {
return function () {
$(element).find('svg').each(function () {
$(this).find("g").each(function () {
if ($(this).attr('clip-path')) {
if ($(this).attr('clip-path').indexOf('url(#') == -1)
return;
$(this).attr('clip-path', 'url(' + document.location + $(this).attr('clip-path').substring(4))
}
});
$(this).find("rect").each(function () {
if ($(this).attr('fill')) {
if ($(this).attr('fill').indexOf('url(#') == -1)
return;
$(this).attr('fill', 'url(' + document.location + $(this).attr('fill').substring(4))
}
});
});
};
}
var chartElement = document.getElementById('chart');
var data = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Germany', 200],
['United States', 300],
['Brazil', 400],
['Canada', 500],
['France', 600],
['RU', 700]
]);
var options = {};
var chart = new google.visualization.GeoChart(chartElement);
// uncomment next string to fix geochart legend gradient
//google.visualization.events.addListener(chart, 'ready', fixGoogleCharts(chartElement));
chart.draw(data, options);
},
packages: ["geochart"]
});
</script>
</body>
</html>
此 API 问题正在讨论 here 。请务必在调用 chart.draw
关于javascript - Google Charts Geochart colorAxis 不显示渐变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29328092/