echarts基本地图
来源:互联网 发布:传感器网络的安全问题 编辑:程序博客网 时间:2024/05/16 15:32
echarts基本地图
var data = [ {name: '杭州', value: 250}];var geoCoordMap = { '杭州':[120.19,30.26]};var convertData = function (data) { var res = []; for (var i = 0; i < data.length; i++) { var geoCoord = geoCoordMap[data[i].name]; if (geoCoord) { res.push({ name: data[i].name, value: geoCoord.concat(data[i].value) }); } } return res;};option = { backgroundColor: '#404a59', //标题 title: { text: '测试', subtext: '', sublink: '', left: 'center', textStyle: { color: '#fff' } }, //鼠标悬浮显示值 tooltip : { trigger: 'item', show:false }, geo: { map: 'china', label: { emphasis: { show: false//显示区域位置 } }, roam: true,//缩放和平移 itemStyle: { //常态 normal: { areaColor: '#323c48',//地图区域的颜色 borderColor: '#111'//图形的描边颜色 }, //高亮状态 emphasis: { areaColor: '#2a333d'//图形的颜色 } } }, series : [ { name: 'Top 5', type: 'effectScatter', coordinateSystem: 'geo', data: convertData(data.sort(function (a, b) { return b.value - a.value; }).slice(0, 6)), //点大小 symbolSize: function (val) { return val[2] / 10; }, showEffectOn: 'render',//绘制完成后显示波纹 rippleEffect: { period:1,//动画速度 scale:2,//波纹的范围 brushType: 'fill'//波纹样式(fill填充型) }, hoverAnimation: true, label: { normal: { formatter: '{b}', position: 'right', show: false } }, itemStyle: { normal: { color: '#f4e925',//圆颜色 shadowBlur: 10, shadowColor: '#333'//阴影 } }, zlevel: 1 } ]};
阅读全文
0 0
- echarts基本地图
- echarts地图
- ECharts 浙江地图实践
- Echarts地图实例
- ECharts地图使用
- echarts 地图 热点 统计图
- Echarts地图合并提取
- ECharts之地图
- echarts地图生成
- ECharts地图详解
- 百度echarts中地图
- ECharts地图详解
- 用echarts绘制地图
- ECharts地图应用定位
- Echarts地图使用扩展
- echarts省级地图
- echarts 地图外边框
- echarts地图分布-实例
- nutz入门
- 被版本更新坑到哭系列:SpringBoot整合Kafka
- 动脑学院 安卓VIP课程视频包括(性能优化,移动框架,高级UI,DNK)
- Windows 下利用cWrsync同步
- linux chkconfig命令 运行级别 service
- echarts基本地图
- jquery.tmpl详解
- 第6章 Unity 中的基础光照
- 5-3 多级派生类的构造函数
- 生产者消费者实例!!!
- 小程序 语音识别(一)
- 枚举 编程题#1: 画家问题(Coursera 程序设计与算法 专项课程4 算法基础 郭炜、刘家瑛;二进制实现)
- 龙与地下城游戏问题
- 使用jquery ajax jsop gpsspg api转换坐标