![](https://img-blog.csdnimg.cn/20200402173924322.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
eCharts学习
eCharts学习
X北辰北
坐标成都,专注于Web开发,主要技术栈为React。
展开
-
04 【ArcGIS JS API + eCharts系列】实现二、三维网络路径图的绘制
概述前面两篇文章通过扩展EchartsLayer.js这个图层类,实现了使用ArcGIS JS API和eCharts,在二维和三维场景下绘制迁徙图和散点图。这篇文章继续通过绘制网络路径图的例子,再来验证下我们扩展的这个图层类是否可用,先来看下最终效果:实现思路迁徙图、散点图和网络路径图这种图表跟地理坐标关系紧密,所以仅仅通过第一篇二维普通图表绘制的方式是无法实现这...原创 2020-03-29 14:21:58 · 2823 阅读 · 3 评论 -
03 【ArcGIS JS API + eCharts系列】实现二、三维散点图的绘制
概述上一篇文章中我们介绍了如何使用ArcGIS JS API和eCharts结合,在二维和三维场景下绘制迁徙图。这篇文章我们来介绍下如何在二维和三维场景下绘制散点图,其实散点图跟迁徙图一样,它的绘制也跟地理坐标系有关,所以实现思路跟迁徙图的绘制是一样的,我们来看下最终效果:实现思路迁徙图、散点图这种图表跟地理坐标关系紧密,所以仅仅通过二维普通图表绘制的方式是无法实现这类图...原创 2020-03-29 10:00:14 · 3297 阅读 · 11 评论 -
02 【ArcGIS JS API + eCharts系列】实现二、三维迁徙图的绘制
概述上一篇文章通过纯前端的方式实现了ArcGIS JS API和eCharts的普通二维图表绘制,因为这些图表绘制其实是跟地理坐标无关的,只需要设置图表的位置即可,所以仅仅用了纯前端的方式去实现。这篇文章通过参考【dGIS】大佬的文章,重构了EchartsLayer.js文件(因为网上所有关于EchartsLayer.js文件的代码全部是编译过的,阅读起来很不友好,并且有些EchartsLay...原创 2020-03-26 10:29:59 · 3762 阅读 · 18 评论 -
01 【ArcGIS JS API + eCharts系列】实现地图上二维图表的绘制
概述ArcGIS API for JavaScript目前提供的图表绘制接口十分有限,而且样式也并不美观,当我们在地图上添加相应的图表的时候,还是需要结合目前市面上其他的图表可视化插件来做。本文就介绍下如何使用ArcGIS API for JavaScript 4.14版本和eCharts 4.7.0来实现这个需求。首先来看下最终的效果:实现思路此需求的实现完全是...原创 2020-03-23 22:13:43 · 5133 阅读 · 12 评论 -
05 【eCharts样式定制系列】自定义地图
描述项目的UI设计稿中,大屏展示模块有地图模块,原本项目使用的是我们ArcGIS JS API初始化后的一个地图服务图层,不过为了美观考虑,最后决定大屏模块的地图使用eCharts来自定义,UI设计稿中的地图如下:通过查看UI设计图发现,通过JS API来实例化一个地图图层服务来实现这个模块的话,就需要重新制作一份暗夜色的地图,然后发布服务,前端调用实现,这个过程有点繁琐,所以我们接下...原创 2020-01-15 14:42:44 · 2268 阅读 · 0 评论 -
04 【eCharts样式定制系列】矩形树图自定义颜色
描述在目前的项目中,根据UI设计稿需要实现一个带有大屏的系统首页,在此首页上要添加地图和一些eCharts图表。但是根据UI设计稿,如果要达到美观的目的,需要对eCharts进行定制。此次需要定制的图表是矩形树图。我们先来看一下UI设计稿中的图表:其次再看一下eCharts官网默认的图表:通过和官网的图表demo作对比,我们需要对矩形树图的颜色进行定制。目前使用的...原创 2020-01-15 14:39:10 · 7968 阅读 · 4 评论 -
03 【eCharts样式定制系列】雷达图自定义面积覆盖颜色
描述在目前的项目中,根据UI设计稿需要实现一个带有大屏的系统首页,在此首页上要添加地图和一些eCharts图表。但是根据UI设计稿,如果要达到美观的目的,需要对eCharts进行定制。此次需要定制的图表是雷达图。我们先来看一下UI设计稿中的图表:其次再看一下eCharts官网默认的图表:通过和官网的图表demo作对比,我们需要对雷达图的覆盖区域颜色、网格线颜色、网格线...原创 2020-01-15 14:33:28 · 9178 阅读 · 3 评论 -
02 【eCharts样式定制系列】玫瑰图、环形饼图、漏斗图自定义各项数据的颜色
描述在目前的项目中,根据UI设计稿需要实现一个带有大屏的系统首页,在此首页上要添加地图和一些eCharts图表。但是根据UI设计稿,如果要达到美观的目的,需要对eCharts进行定制。此次需要定制的图表依次是玫瑰图、环形图、漏斗图。我们先来看一下UI设计稿中的图表:其次再看一下eCharts官网默认的图表:通过和官网的图表demo作对比,我们需要对...原创 2020-01-13 21:15:07 · 2779 阅读 · 0 评论 -
01 【eCharts样式定制系列】柱状图修改柱状颜色、柱状形状等
描述在目前的项目中,根据UI设计稿需要实现一个带有大屏的系统首页,在此首页上要添加地图和一些eCharts图表。但是根据UI设计稿,如果要达到美观的目的,需要对eCharts进行定制。接下来我们先对第一个图表——柱状图,进行定制。我们先来看一下UI设计稿中的柱状图:其次再看一下eCharts官网默认的柱状图:除去DIV内边框的晕眩效果可以通过CSS或者直接拿切图...原创 2020-01-13 21:07:23 · 15802 阅读 · 5 评论