我需要使用 displayMode: 'markers', 同时我需要为所有国家/地区设置一些颜色。任何想法都值得赞赏。
<html>
<head>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBzxARGqOQpBrFuR7TqJwHWjyxHMf-gfIk&callback=initMap"
type="text/javascript"></script>
<script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
<script type='text/javascript'>
google.charts.load('upcoming', {'packages': ['geochart']});
google.charts.setOnLoadCallback(drawMarkersMap);
function drawMarkersMap() {
var data = google.visualization.arrayToDataTable([
['City', 'Population', 'Area'],
['Kiev', 2761477, 1285.31],
['Kherson', 1324110, 181.76],
['Zakarpattiya', 1324110, 181.76],
['Zhitomir', 1324110, 181.76],
['Harkiv', 1324110, 181.76],
['Kirovohrad', 1761477, 181.76],
]);
var options = {
region: 'UA',
resolution: 'provinces',
displayMode: 'markers',
pointSize: 10,
pointShape: 'diamond',
colorAxis: {colors: ['green', 'blue']},
enableRegionInteractivity: false,
hAxis: {minValue: 20, maxValue: 20},
sizeAxis: {minSize: 27, maxSize: 27},
enableRegionInteractivity: 'true',
defaultColor: '#ffffff',
};
options['colors'] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
;
</script>
</head>
<body>
<div id="chart_div" style="width: 100%; height: 800px;"></div>
</body>
</html>最佳答案
您可以使用选项 --> datalessRegionColor -- 设置区域的背景颜色
请参阅以下工作片段...
google.charts.load('current', {
callback: drawRegionsMap,
packages:['geochart']
});
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['City', 'Population', 'Area'],
['Kiev', 2761477, 1285.31],
['Kherson', 1324110, 181.76],
['Zakarpattiya', 1324110, 181.76],
['Zhitomir', 1324110, 181.76],
['Harkiv', 1324110, 181.76],
['Kirovohrad', 1761477, 181.76],
]);
var options = {
region: 'UA',
resolution: 'provinces',
displayMode: 'markers',
pointSize: 10,
pointShape: 'diamond',
colorAxis: {colors: ['green', 'blue']},
hAxis: {minValue: 20, maxValue: 20},
sizeAxis: {minSize: 27, maxSize: 27},
datalessRegionColor: '#ffcc80'
};
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
chart.draw(data, options);
};<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>关于javascript - 谷歌地理图表设置标记显示模式与国家/地区的背景颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41947477/