echarts -数据大屏开发，资料汇总

部门新下任务，大屏数据展示，安排我和另外一个同事共同开发，最终效果如下。效果图本次数据看板用到的前端技术有vue、echarts。本篇主要是对echarts技术栈资料的总结，echarts使用简单，在此不展开，有学习可以移步官网。资料的总结一、地图筛选器ali出品，可以生成地图json，对应右上角地图注册http://datav.aliyun.com/tools/atlas/#&lat=3

第七人格

9187人浏览 · 2020-11-29 19:28:41

第七人格 · 2020-11-29 19:28:41 发布

部门新下任务，大屏数据展示，安排我和另外一个同事共同开发，最终效果如下。

效果图

本次数据看板用到的前端技术有vue、echarts。本篇主要是对echarts技术栈资料的总结，echarts使用简单，在此不展开，有学习可以移步官网。

资料的总结

一、地图筛选器

ali出品，可以生成地图json，对应右上角地图注册

http://datav.aliyun.com/tools/atlas/#&lat=33.521903996156105&lng=104.29849999999999&zoom=4

二、github

（1）echarts

https://github.com/apache/incubator-echarts/blob/master/index.js

（2）水球图

对应左上角水球

https://github.com/ecomfe/echarts-liquidfill#api

三、echarts官网

https://www.echartsjs.com/examples/zh/index.html#chart-type-map

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^