Plotly.js的地图使用的是Mapbox GL js,Mapbox公司的数据服务分为三个层次,其一为开源数据,这类可以直接使用;其二为免费数据,需要在mapbox官网注册账号,并获取token,这个token需要自定义代码中;其三为收费数据,同样需要token,并为当前账户充值。一般情况下开源和免费数据就够用。Redash中文版本以设置默认语言为中文zh;

Plotly.js地图功能非常丰富,下面我们就以一个飞线地图为例,介绍开发者模式下,开发地图功能。

var data = [{
    type: 'scattergeo',
    lat: [ 31.22, 39.9 ],
    lon: [ 121.48, 116.4 ],
    mode: 'lines',
    line:{
        width: 2,
        color: 'blue'
    }
  }];

var layout = {
  title: '北京到上海',
  showlegend: false,
  geo: {
      resolution: 50,
      showrivers: true,
      rivercolor: '#fff',
      showlakes: true,
      lakecolor: '#fff',
      showland: true,
      landcolor: '#EAEAAE',
      countrycolor: '#d3d3d3',
      countrywidth: 1.5,
      subunitcolor: '#d3d3d3',
      projection: {
        type: 'equirectangular'
      },
      coastlinewidth: 2,
      lataxis: {
        range: [ 25, 45 ],
        showgrid: true,
        tickmode: 'linear',
        dtick: 10
      },
      lonaxis:{
        range: [105, 125],
        showgrid: true,
        tickmode: 'linear',
        dtick: 20
      }
    }
};

Plotly.newPlot(element, data, layout);

匹配结果 ""

    没有匹配结果 ""