Highmaps未使用颜色渐变

时间:2016-10-06 22:11:25

标签: highcharts highmaps

我正在使用Highmaps来显示每个国家/地区的相关用户数量。然后应该以渐变显示,以便来自一个国家的用户越多,颜色越深。我让它在Highmaps中运行以便加载数据,但由于某种原因,它显示所有黑色国家,尽管渐变图例是白色到蓝色。知道为什么会这样吗?谢谢!

$(document).ready(function(){
  // Basic highcharts initialization
  Highcharts.setOptions({
    lang: {
      thousandsSep: ','
    }
  });

  var analytics_map = new AnalyticsMap('#container');
  analytics_map.setTitle('# of Signups');
  analytics_map.load([
  	["AE","31"],
    ["AR","51"],
    ["AT","71"],
    ["AU","81"],
    ["BE","91"],
    ["BG","9"],
    ["BO","22"],
    ["BR","37"],
   	["US","173"],
    ["UY","5"],
    ["ZA","19"]
  ]);
  
  function AnalyticsMap(selector){
    this.selector = selector,
    this.title = 'Default Title',
    this.setTitle = function (title){
      this.title = title;
    },
    this.load = function(data){
      $(this.selector).highcharts('Map', {
        title: {
          text: this.title
        },
        mapNavigation: {
          enabled: true,
          buttonOptions: {
            verticalAlign: 'bottom'
          }
        },
        colorAxis: { 
        },
        series: [{
          data: data,
          mapData: Highcharts.maps['custom/world'],
          joinBy: ['iso-a2', 0],
          keys: ['iso-a2', 'value'],
          name: this.title,
          dataLabels: {                 
            //enabled: true, 
            //format: '{point.code}'
          },
          tooltip: {
            pointFormat: '{point.iso-a2}: {point.value} signups'
          }
        }]
      });
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/mapdata/custom/world.js"></script>

<div id="container"></div>

1 个答案:

答案 0 :(得分:2)

您遇到数据类型问题。

不要通过在它们周围加上引号将整数转换为字符串。

var data = [ ['DE.SH', 728], ['DE.BE', 710], ['DE.MV', 963], ['DE.HB', 541], ['DE.HH', 622], ['DE.RP', 866], ['DE.SL', 398], ['DE.BY', 785], ['DE.SN', 223], ['DE.ST', 605], ['DE.NW', 237], ['DE.BW', 157], ['DE.HE', 134], ['DE.NI', 136], ['DE.TH', 704], ['DE.', 361] ];