EChart中使用地图方式总结(转载)

EChart中使用地图方式总结

      最近在仿照EChart公交线路方向示例,开发表示排水网和污水网流向地图,同时地图上需要叠加排放口、污染源、污水处理厂等要素。由于之前没有用过EChart,尤其是EChart的地图功能,琢磨尝试很久,终于弄明白了地图上面、线及点要素的加载及显示方法,总结如下。

      1、底图的加载

      一般地图都需要底图,EChart中底图的数据来源,有三种方式,分别如下:

(1)百度地图。需要引入百度地图API,具体使用方法参见官方示例(http://echarts.baidu.com/examples/editor.html?c=lines-bmap-effect,如下左图),此时series中引入的其他要素层中,coordinateSystem 的值必须设置为 'bmap',也就是其它层的数据,以bmap地图作为空间坐标系统的参照,如下右图:

                         

(2)json及registerMap的方式。这种方式底图数据以json(geojson)格式存储,具体geojson的格式(参考http://geojson.org/)及转换为geojson的方法(可采用Mapshaper,使用参考http://blog.csdn.net/column/details/14830.html)自行了解。在获取json格式的数据后,采用registerMap进行手动注册,给地图取一个名字。EChart中使用的方法,可参考官方示例(http://echarts.baidu.com/examples/editor.html?c=map-usa),series中的map为用户自己注册的地图,要点如下。注意问题:registerMap只能注册面状要素的json数据,对点、线无效!

                 

(3)<script及geo方式。这种方式的底图数据,可以直接用 script 标签引入包含数据的 js 文件,引入后会自动注册地图名字和数据,如<script src="../../data/china.js"></script>,引入后EChart自动对地图进行注册,可参考EChart官方示例(http://www.echartsjs.com/gallery/editor.html?c=scatter-map),使用要点如下。注意问题:series中的coordinateSystem必须设置为 geo,即采用的坐标系统参考与geo中定义的地图保持一致;geo方式也只适用于面状地图数据,对点和线要素数据无效!

            

2、线要素的加载

线要素的加载,一般通过series中type设置为 line 的方式实现(具体参考http://echarts.baidu.com/option.html#series-lines),参数coordinateSystem设置为bmap(百度地图)、geo或registerMap手动注册的地图名称。

3、点要素的加载

点要素的加载,一般通过series中type设置为scatter或effectScatter(具体参考http://echarts.baidu.com/option.html#series-scatter和http://echarts.baidu.com/option.html#series-effectScatter),参数coordinateSystem设置为bmap(百度地图)、geo或registerMap手动注册的地图名称。

以上是对EChart中使用地图的总结,不恰当的地方还请及时指出,谢谢!

 

转载于:https://www.cnblogs.com/hao-1234-1234/p/9292996.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/389180.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

android mvp模式

越来越多人讨论mvp模式&#xff0c;mvp在android应用开发中获得更多的重视&#xff0c;这里说一下对MVP的简单了解。 什么是 MVP? MVP模式使逻辑从视图层分开&#xff0c;目的是我们在屏幕上怎么表现&#xff0c;和界面如何工作的所有事情就完全分开了。 View显示数据&…

Node.js REPL(交互式解释器)

2019独角兽企业重金招聘Python工程师标准>>> Node.js REPL(交互式解释器) Node.js REPL(Read Eval Print Loop:交互式解释器) 表示一个电脑的环境&#xff0c;类似 Window 系统的终端或 Unix/Linux shell&#xff0c;我们可以在终端中输入命令&#xff0c;并接收系统…

中国移动短信网关CMPP3.0 C#源代码:使用示例

中国移动短信网关CMPP3.0 C#源代码&#xff1a;使用示例 中国移动短信网关CMPP3.0 C#源代码使用&#xff0c;在上一篇文章中我介绍过cmpp3.0,这段时间因为也做关于移动短信网关的开发&#xff0c;在这里给大家一个演示如何使用cmpp3.0开发移动短信网关。Using Tiray.SMS... Ti…

用python进行营销分析_用python进行covid 19分析

用python进行营销分析Python is a highly powerful general purpose programming language which can be easily learned and provides data scientists a wide variety of tools and packages. Amid this pandemic period, I decided to do an analysis on this novel coronav…

名称

命名规则&#xff1a;Go中函数、变量、常量、类型、语句标签和包的名称都遵循一个规则&#xff0c;开头是一个字母或下划线&#xff0c;后面跟任意字符、数字和下划线&#xff0c;并区分大小写。例如&#xff1a;heapSort和HeapSort是不同名称。关键字&#xff1a;Go有25个关键…

Alpha冲刺第二天

Alpha第二天 1.团队成员 郑西坤 031602542 &#xff08;队长&#xff09; 陈俊杰 031602504陈顺兴 031602505张胜男 031602540廖钰萍 031602323雷光游 031602319苏芳锃 0316023302.项目燃尽图 3.项目进展 时间工作内容11月18日UI设计、初步架构搭建11月19日UI设计、服务器的进一…

Tiray.SMSTiray.SMSTiray.SMSTiray.SMSTiray.SMSTiray.SMS

这是2005年6月云南移动短信网关升级到3.0时写的&#xff0c;在SP那稳定运行了很长时间的。因为SP倒闭了&#xff0c;贴出来给有兴趣的朋友参考。优点&#xff1a;支持多线程、滑动窗口、异步发送、全事件模式、自动识别ASCII、GBK、UCS-2缺点&#xff1a;不支持长短信自动分页、…

水文分析提取河网_基于图的河网段地理信息分析排序算法

水文分析提取河网The topic of this article is the application of information technologies in environmental science, namely, in hydrology. Below is a description of the algorithm for ranking rivers and the plugin we implemented for the open-source geographic…

请不要更多的基本情节

“If I see one more basic blue bar plot…”“如果我再看到一个基本的蓝色条形图……” After completing the first module in my studies at Flatiron School NYC, I started playing with plot customizations and design using Seaborn and Matplotlib. Much like doodl…

Powershell-获取DHCP地址租用信息

需求&#xff1a;业务需要获取现阶段DHCP服务器所有地址租用信息。 1.首先查看DHCP相关帮助信息&#xff1a;2.确定执行命令并获取相关帮助信息&#xff1a;help Get-DhcpServerv4Scope 名称 Get-DhcpServerv4Scope 语法 Get-DhcpServerv4Scope [[-ScopeId] <ipaddress[]>…

c# 对COM+对象反射调用时地址参数处理 c# 对COM+对象反射调用时地址参数处理

使用反射的方式调用组件里面的方法&#xff0c;经常会遇见一些象地址参数的处理&#xff0c;在C#中表现为ref参数&#xff0c;比如用C#写了一个装配件&#xff0c;里面有一个方法openProcedure(string ProcName,int paraCount,ref string[] parameters)&#xff0c;最后有一个r…

android触摸消息的派发过程

1.触摸消息是消息获取模块直接派发给应用程序的。 2.触摸消息在处理时&#xff0c; 需要根据触摸坐标计算该消息应该派发给哪个View/ViewGroup, 在案件取消处理中不存在 该计算过程。 3.没有类似”系统按键”的”系统触摸键”&#xff0c; 应用程序可完全控制触摸行为。 4.子…

python 交互式流程图_使用Python创建漂亮的交互式和弦图

python 交互式流程图Python中的数据可视化 (Data Visualization in Python) R vs Python is a constant tussle when it comes to what is the best language, according to data scientists. Though each language has it’s strengths, R, in my opinion has one cutting-edg…

机器学习解决什么问题_机器学习帮助解决水危机

机器学习解决什么问题According to Water.org and Lifewater International, out of 57 million people in Tanzania, 25 million do not have access to safe water. Women and children must travel each day multiple times to gather water when the safety of that water …

递归原来可以so easy|-连载(3)

本期我们再通过几个例子&#xff0c;加深递归的理解和熟练度。 上期有一个练习题&#xff1a;用递归逆序输出一个包含整型数据的链表。 先完成这个练习题。 对于程序员来说&#xff0c;代码是最好的沟通工具&#xff0c;什么都不说&#xff0c;上代码&#xff1a; public class…

Viewport3D 类Viewport3D 类Viewport3D 类

.NET Framework 类库Viewport3D 类更新&#xff1a;2007 年 11 月为三维可视内容提供呈现图面。命名空间&#xff1a; System.Windows.Controls程序集&#xff1a; PresentationFramework&#xff08;在 PresentationFramework.dll 中&#xff09;用于 XAML 的 XMLNS&#xf…

升级android 6.0系统

How to Fix errors by manually flashing Marshmallow update 镜像下载for nexus Factory image Step 1: Download the [Marshmallow factory image](http://www.theandroidsoul.com/download-mra58k-android-6-0-marshmallow-update-released-for-nexus-5-nexus-6-nexus-9-n…

AGC 022 B - GCD Sequence

题面在这里&#xff01; 锻炼脑子的小构造题。。。 一开始被 a[]<30000 且 序列 gcd 1所困扰&#xff0c;但是发现这并没有什么&#xff0c;因为我接下来发现了一种总是能构造出 序列和是6的倍数的方案。 首先如果 n3 的话输出样例&#xff0c;因为只有这种情况没法用我的方…

最接近原点的 k 个点_第K个最接近原点的位置

最接近原点的 k 个点In this article, I will be explaining to you one of the problems that you may find when tackling questions in data structures and algorithm. You will need some basic knowledge of data structures in order to understand the optimized solut…

网络浏览器如何工作

Behind the scenes of modern Web Browsers现代Web浏览器的幕后花絮 The Web Browser is inarguably the most common portal for users to access the web. The advancement of the web browsers (through the series of history) has led many traditional “thick clients”…