Google visualization 谷歌可视化-地球艺术-国家颜色比例、标签和图例

Google visualization 谷歌可视化-地球艺术-国家颜色比例、标签和图例,google-visualization,Google Visualization,我很难让Google GeogoArt像他们在文档(甚至样本)中描述的那样工作 在本页的示例中,地理图表显示了使用基于流行度的比例的国家颜色。然而,我自己的地图显示了所有国家都有相同的深色,而不管受欢迎程度如何。此外,该示例显示一个图例,而我自己的图例不显示,区域示例还显示带有国家名称和值的工具提示标签,而我的示例仅显示数据的原始值 我一直在翻阅文档,试图弄明白这一点,但我被卡住了。谢谢你的帮助 下面是我的代码: <script type="text/javascript" src="h

我很难让Google GeogoArt像他们在文档(甚至样本)中描述的那样工作

在本页的示例中,地理图表显示了使用基于流行度的比例的国家颜色。然而,我自己的地图显示了所有国家都有相同的深色,而不管受欢迎程度如何。此外,该示例显示一个图例,而我自己的图例不显示,区域示例还显示带有国家名称和值的工具提示标签,而我的示例仅显示数据的原始值

我一直在翻阅文档,试图弄明白这一点,但我被卡住了。谢谢你的帮助

下面是我的代码:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {'packages':['geochart']});
  google.setOnLoadCallback(drawRegionsMap);
  function drawRegionsMap() {
    var data = google.visualization.arrayToDataTable([
      ['Country', 'Visits'],
  ['Austria','1'],
      ['Brazil','2'],
      ['Canada','40'],
      ['China','1'],
      ['Czech Republic','1'],
      ['Denmark','1'],
      ['Dominican Republic','1'],
      ['Ecuador','1'],
      ['France','1'],
      ['Netherlands','21'],
      ['United Kingdom','13'],
      ['United States','1140']
 ]);

    var options = {
        colorAxis: {colors: ['#f5f5f5','#267114']},
        legend: 'Vists'
    };

    var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>

load('visualization','1',{'packages':['geochart']});
setOnLoadCallback(DrawRegionMap);
函数drawRegionsMap(){
var data=google.visualization.arrayToDataTable([
[‘国家’、‘访问’],
[‘奥地利’,‘1’],
[‘巴西’,‘2’],
[‘加拿大’、‘40’],
[‘中国’、‘1’],
[‘捷克共和国’,‘1’],
[‘丹麦’,‘1’],
[‘多米尼加共和国’,‘1’],
[‘厄瓜多尔’,‘1’],
[‘法国’,‘1’],
[‘荷兰’、‘21’],
[‘联合王国’、‘13’],
[‘美国’,‘1140’]
]);
变量选项={
颜色轴:{colors:['#f5','#267114']},
传说:“维斯特”
};
var chart=new google.visualization.geograpart(document.getElementById('chart_div'));
图表绘制(数据、选项);
}

您的问题是,由于您在引号中指定了您的值,地球艺术将您的值视为位置名称。为了将它们解释为值,它们需要是数字。通过这样做,我能够让你的例子起作用

以下是修改后的代码:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {'packages':['geochart']});
  google.setOnLoadCallback(drawRegionsMap);
  function drawRegionsMap() {
    var data = google.visualization.arrayToDataTable([
      ['Country', 'Visits'],
      ['Austria', 1],
      ['Brazil',  2],
      ['Canada',  40],
      ['China',   1],
      ['Czech Republic',1],
      ['Denmark', 1],
      ['Dominican Republic',1],
      ['Ecuador', 1],
      ['France',  1],
      ['Netherlands',   21],
      ['United Kingdom',13],
      ['United States',1140]
 ]);

    var options = {
        colorAxis: {colors: ['#f5f5f5','#267114']},
        legend: 'Vists'
    };

    var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>

load('visualization','1',{'packages':['geochart']});
setOnLoadCallback(DrawRegionMap);
函数drawRegionsMap(){
var data=google.visualization.arrayToDataTable([
[‘国家’、‘访问’],
[‘奥地利’,1],
[‘巴西’,2],
[‘加拿大’,40],
[‘中国’,1],
[‘捷克共和国’,1],
[‘丹麦’,1],
[‘多米尼加共和国’,1],
[‘厄瓜多尔’,1],
[‘法国’,1],
[‘荷兰’,21],
[‘联合王国’,13],
[‘美国’,1140]
]);
变量选项={
颜色轴:{colors:['#f5','#267114']},
传说:“维斯特”
};
var chart=new google.visualization.geograpart(document.getElementById('chart_div'));
图表绘制(数据、选项);
}

我希望这有帮助

以下是两个问题(工具提示和图例)的解决方案

  • 对于工具提示,必须指定不带引号的整数值
  • 对于图例,无需在
    选项中指定图例属性。
    这是正确的代码

    var data = google.visualization.arrayToDataTable([
      ['Country', 'Visits'],
      ['Austria', 1],
      ['Brazil', 2],
      ['Canada', 40],
      ['China', 1],
      ['Czech Republic', 1],
      ['Denmark', 1],
      ['Dominican Republic', 1],
      ['Ecuador', 1],
      ['France', 1], 
      ['Netherlands', 21],
      ['United Kingdom', 13],
      ['United States', 1140]
    ]);
    
     var options = {
        colorAxis: {colors: ['#f5f5f5','#267114']}
        //legend: 'Vists'
    };
    
这是你的电话号码。
有关更多与地理图表相关的查询,请查看

,以防其他人遇到这种情况-颜色的问题似乎是单引号中的数字字段被解释为字符串数据而不是数字数据。删除单引号解决了这个问题。缺少传奇仍然是一个问题。