美文网首页程序员
最简单的Echarts3迁徙图实现

最简单的Echarts3迁徙图实现

作者: _空指针 | 来源:发表于2017-10-09 21:11 被阅读0次

    最近想模仿windy网站自己实现一个气流动态图,经过不懈的尝试,终于实现了在地图上描绘动态点

    windy网站截图 自己实现的几个点

    这几个就是需要的js文件,echarts在官网下载,中国地图和世界地图的js文件我是从echarts的github开源包里找出来的,本例只用到了世界地图。

    这段配置为地图的初始化配置,之前的官方示例使用series[i]-map作为地图初始化的配置,使用echarts3的包和原来的示例代码会报一个函数不存在的错误,在这个地方折腾了好久,几乎快放弃。偶然看到官方文档的一句提示

    Tip: 在 ECharts 3 中不再建议在地图类型的图表使用 markLine 和 markPoint。如果要实现点数据或者线数据的可视化,可以使用在地理坐标系组件上的散点图和线图。

    没错,介个geo就是地理坐标系的配置

    这一段,就是绘制动态点的过程。series设置为lines属性,effect属性设置动画特效,data中为地理坐标经纬度的点。

    相关文章

      网友评论

        本文标题:最简单的Echarts3迁徙图实现

        本文链接:https://www.haomeiwen.com/subject/ihzpyxtx.html