Fatal编程技术网
  • google-maps/
  • Google maps 谷歌艺术不着色轴上的省份

Google maps 谷歌艺术不着色轴上的省份

google-maps charts google-visualization

Google maps 谷歌艺术不着色轴上的省份,google-maps,charts,google-visualization,Google Maps,Charts,Google Visualization,我的艺术代码显示不正确 它将整个地图显示为纯绿色，而不是基于 人气 我尝试了各种颜色和coloraxismin./max值，但均无效。如有任何见解，将不胜感激 -我只需要根据第二列的#对每个状态进行着色 <html> <head> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <scrip

我的艺术代码显示不正确

  • 它将整个地图显示为纯绿色，而不是基于 人气
  • 我尝试了各种颜色和coloraxismin./max值，但均无效。如有任何见解，将不胜感激
-我只需要根据第二列的#对每个状态进行着色

 <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {
        'packages':['geochart'],
        // Note: you will need to get a mapsApiKey for your project.
        // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
        'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
      });
      google.charts.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {
        var data = google.visualization.arrayToDataTable([
          ['State', 'Popularity'],
    ['AK','678'],
['AL','972'],
['AR','1403'],
['AZ','1420'],
['CA','10235'],
['CO','1703'],
['CT','1113'],
['DC','1136'],
['DE','511'],
['FL','5655'],
['GA','3085'],
['HI','479'],
['IA','6514'],
['ID','622'],
['IL','61795'],
['IN','11863'],
['KS','2323'],
['KY','4103'],
['LA','958'],
['MA','2208'],
['MD','5546'],
['ME','616'],
['MI','13239'],
['MN','17437'],
['MO','5681'],
['MS','654'],
['MT','714'],
['NC','1919'],
['ND','2003'],
['NE','2317'],
['NH','620'],
['NJ','3516'],
['NM','469'],
['NV','605'],
['NY','10336'],
['OH','9664'],
['OK','1828'],
['OR','1523'],
['PA','6264'],
['RI','342'],
['SC','901'],
['SD','1350'],
['TN','4612'],
['TX','5016'],
['UT','808'],
['VA','4530'],
['VT','268'],
['WA','2268'],
['WI','30132'],
['WV','1353'],
['WY','299']          
        ]);

        var options = {
    region: "US",
    resolution: "provinces",
     colorAxis: {
            minValue: 0,
            maxValue: 10000
          }
    };

        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>


google.charts.load（'current'{
“包”：[“地球艺术”]，
//注意：您需要为您的项目获取mapsApiKey。
//见：https://developers.google.com/chart/interactive/docs/basic_load_libs#load-背景
“mapsApiKey”：“AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY”
});
google.charts.setOnLoadCallback（DrawRegionMap）；
函数drawRegionsMap（）{
var data=google.visualization.arrayToDataTable([
[“州”、“流行度”]，
['AK'，'678']，
['AL'，'972']，
['AR'，'1403']，
['AZ'，'1420']，
[CA'，'10235']，
[CO'，'1703']，
['CT'，'1113']，
['DC'，'1136']，
[DE'，511']，
['FL'，'5655']，
['GA'，'3085']，
[HI'，'479']，
['IA'，'6514']，
['ID'，'622']，
[IL'，'61795']，
[IN'，'11863']，
[KS'，2323']，
[KY'，'4103']，
['LA'，'958']，
['MA'，'2208']，
['MD'，'5546']，
['ME'，'616']，
[MI'，13239']，
[MN'，'17437']，
['MO'，'5681']，
['MS'，'654']，
[MT'，'714']，
[NC'，'1919']，
[ND'，'2003']，
[NE'，'2317']，
[NH'，620']，
[NJ'，'3516']，
['NM'，'469']，
[NV'，605']，
['NY'，'10336']，
['OH'，'9664']，
[好的，'1828']，
['OR'，'1523']，
['PA'，'6264']，
['RI'，'342']，
['SC'，'901']，
['SD'，'1350']，
[TN'，'4612']，
['TX'，'5016']，
[UT'，808']，
['VA'，'4530']，
[VT'，'268']，
['WA'，'2268']，
[WI'，'30132']，
[WV'，'1353']，
['WY'，'299']
]);
变量选项={
地区：“美国”，
决议：“各省”，
颜色轴：{
最小值：0，
最大值：10000
}
};
var chart=new google.visualization.geograpart（document.getElementById（'regions_div'））；
图表绘制（数据、选项）；
}
第二个数据表列中的值应该是数字（
678
），而不是字符串（
'678'
）

请参阅以下工作片段

google.charts.load（'current'{
回调：DrawRegionMap，
软件包：['geochart']，
mapsApiKey:'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
});
函数drawRegionsMap（）{
var data=google.visualization.arrayToDataTable([
[“州”、“流行度”]，
[AK'，678]，
[AL'，972]，
[AR'，1403]，
['AZ'，1420]，
[CA'，10235]，
[CO'，1703]，
[CT'，1113]，
[DC'，1136]，
[DE'，511]，
[FL'，5655]，
[GA'，3085]，
[HI'，479]，
[IA'，6514]，
[ID'，622]，
[IL'，61795]，
[IN'，11863]，
[KS'，2323]，
[KY'，4103]，
[LA'，958]，
[MA'，2208]，
[MD'，5546]，
[ME'，616]，
[MI'，13239]，
[MN'，17437]，
[MO'，5681]，
[MS'，654]，
[MT'，714]，
[NC'，1919]，
[ND'，2003]，
[NE'，2317]，
[NH'，620]，
[NJ'，3516]，
[NM'，469]，
[NV'，605]，
[NY'，10336]，
[OH'，9664]，
['OK'，1828]，
[OR'，1523]，
[PA'，6264]，
[RI'，342]，
[SC'，901]，
[SD'，1350]，
[TN'，4612]，
[TX'，5016]，
[UT'，808]，
[VA'，4530]，
[VT'，268]，
[WA'，2268]，
[WI'，30132]，
[WV'，1353]，
[WY'，299]
]);
变量选项={
地区：“美国”，
决议：“各省”，
颜色轴：{
最小值：0，
最大值：10000
}
};
var chart=new google.visualization.geograpart（document.getElementById（'regions_div'））；
图表绘制（数据、选项）；
}
html，正文{
身高：100%；
保证金：0px 0px 0px 0px；
溢出：隐藏；
填充：0px 0px 0px 0px；
}
.图表{
身高：100%；
}
您的数据不是数字（“值”是字符串）。把它们改成数字

var data = google.visualization.arrayToDataTable([
  ['State', 'Popularity'],
  ['AK','678'],
  ['AL','972'],
应该是：

var data = google.visualization.arrayToDataTable([
  ['State', 'Popularity'],
  ['AK', 678],
  ['AL', 972],

代码片段：

html，
身体，
#区域及分区{
宽度：100%；
身高：100%；
填充：0px；
边际：0px；
}

google.charts.load（'current'{
“包”：[“地球艺术”]，
//注意：您需要为您的项目获取mapsApiKey。
//见：https://developers.google.com/chart/interactive/docs/basic_load_libs#load-背景
“mapsApiKey”：“AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY”
});
google.charts.setOnLoadCallback（DrawRegionMap）；
函数drawRegionsMap（）{
var data=google.visualization.arrayToDataTable([
[“州”、“流行度”]，
[AK'，678]，
[AL'，972]，
[AR'，1403]，
['AZ'，1420]，
[CA'，10235]，
[CO'，1703]，
[CT'，1113]，
[DC'，1136]，
[DE'，511]，
[FL'，5655]，
[GA'，3085]，
[HI'，479]，
[IA'，6514]，
[ID'，622]，
[IL'，61795]，
[IN'，11863]，
[KS'，2323]，
[KY'，4103]，
[LA'，958]，
[MA'，2208]，
[MD'，5546]，
[ME'，616]，
[MI'，13239]，
[MN'，17437]，
[MO'，5681]，
[MS'，654]，
[MT'，714]，
[NC'，1919]，
[ND'，2003]，
[NE'，2317]，
[NH'，620]，
[NJ'，3516]，
[NM'，469]，
[NV'，605]，
[NY'，10336]，
[OH'，9664]，
['OK'，1828]，
[OR'，1523]，
[PA'，6264]，
[RI'，342]，
[SC'，901]，
[SD'，1350]，
[TN'，4612]，
[TX'，5016]，
[UT'，808]，
[VA'，4530]，
[VT'，268]，
[WA'，2268]，
[WI'，30132]，
[WV'，1353]，
[WY'，299]
]);
变量选项={
地区：“美国”，
决议：“各省”，
颜色轴：{
最小值：0，
最大值：10000
}
};
var chart=new google.visualization.geograpart（document.getElementById（'regions_div'））；
图表绘制（数据、选项）；
}