[英]Google geo charts set markers displayMode with background color of country
I need to use displayMode: 'markers',
and in a same time i need to set some color to all country territory.我需要使用
displayMode: 'markers',
同时我需要为所有国家/地区设置一些颜色。 Any ideas are appreciated.任何想法表示赞赏。
<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>
you can use option --> datalessRegionColor
-- to set background color for territories您可以使用选项 -->
datalessRegionColor
-- 为领土设置背景颜色
see following working snippet...请参阅以下工作片段...
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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.