基于ECharts 的地图例子
<script src="js/esl.js"></script>
<script src="js/jquery-1.11.2.min.js"></script>
这里因为用到的是js模块化 所以不用导入ECharts和zrender的js 只需导入esl.js来加载模块化
2 编写HTML部分
<div id="main"></div>
<div id='btn'>数据变换</div>
main是显示的地图 btn是之后为了变化数据为准备的按钮
3 加载器配置路径
require.config({
packages: [
{
name: 'echarts',
location: 'js/src',
main: 'echarts'
},
{
name: 'zrender',
location: 'js/zrender/src',
main: 'zrender'
}
]
});
这里是为模块加载器配置echarts和zrender路径 (这个zrender貌似可以删掉,怪我没有深入研究哈),注意路径要配置正确
4 使用
require([...],function(ec){...});
require有两个参数 第一个是加载使用的模块儿 第二个是加载option和添加事件句柄等
5 填写option
var option={
color:...,
title:{...},
dataRange:{...},
series;[
{
...
},
{
...
}
],
...
}
这里就要根据需求来设置不同的属性了 详细设置还是看下官方API吧
基于ECharts 的地图例子的更多相关文章
- echarts中国地图散点涟漪效果
echarts中国地图例子:http://gallery.echartsjs.com/editor.html?c=effectScatter-map 代码: var data = [{ name: ' ...
- 基于Echarts的中国地图数据展示
发布时间:2018-10-31 技术:javascript+html5+canvas 概述 基于echarts的大数据中国地图展示,结合API定制,开发样式,监听鼠标事件,实现带参数路由跳转等 ...
- vue中,基于echarts 地图实现一个人才回流的大数据展示效果
0.引入echarts组件,和中国地图js import eCharts from 'echarts' import 'echarts/map/js/china.js'// 引入中国地图 1. 设置地 ...
- 数据视化Echarts+百度地图API实现市县区级下钻
开始 这两天公司有个页面需要做数据可视化的展示,数据视化采用的是Echarts+百度地图API做展示,需要用到县级区级下钻的一个联动效果发现网上关于Echarts做到县区级下钻的资料很少,有的话也不是 ...
- ECharts 实现地图散点图上(转载)
转载来源:https://efe.baidu.com/blog/echarts-map-tutorial/ ECharts 实现地图散点图(上) 小红 2016-04-28 ECharts, 教 ...
- echarts map 地图在react项目中的使用
需求 展示海南省地图,点击市高亮展示,并在右侧展示对应市的相关数据. 准备工作 Echarts 海南地图json 效果图 代码 index.tsx import React, { useRef, us ...
- 【百度地图开发之二】基于Fragment的地图框架的使用
写在前面的话: [百度地图开发之二]基于Fragment的地图框架的使用(博客地址:http://blog.csdn.net/developer_jiangqq),转载请注明. Author:hmji ...
- 最简单的基于FFmpeg的AVDevice例子(屏幕录制)
=====================================================最简单的基于FFmpeg的AVDevice例子文章列表: 最简单的基于FFmpeg的AVDev ...
- 最简单的基于FFmpeg的AVDevice例子(读取摄像头)
=====================================================最简单的基于FFmpeg的AVDevice例子文章列表: 最简单的基于FFmpeg的AVDev ...
随机推荐
- GCC扩展 __attribute__ ((visibility("hidden")))
试想这样的情景,程序调用某函数A,A函数存在于两个动态链接库liba.so,libb.so中,并且程序执行需要链接这两个库,此时程序调用的A函数到底是来自于a还是b呢? 这取决于链接时的顺序,比如先链 ...
- php错误级别
E_ERROR 致命的运行错误.错误无法恢复,暂停执行脚本. E_WARNING 运行时警告(非致命性错误).非致命的运行错误,脚本执行不会停止. E_PARSE 编译时解析错误.解析错误只由分析器产 ...
- iOS 静态库和动态库
这两个东西都是编译好的二进制文件.就是用法不同而已.为什么要分为动态和静态两种库呢?先看下图:
- 关于css中z-index 的应用
我想很多人在应用中的会碰到这个问题,设置 z-index无效:无论设置为多高的数字都没有效果: 原因是在设置z-index之前必须满足一下两个条件: 1,给设置z-index的元素设置相应的定位值,p ...
- [置顶] linux 解压版安装
1:下载mysql解压版包去官网下载www.mysq.com 下载.下载linux通用版本就好了 2.基本配置 首先,我们准备好Linux环境,我们使用CentOS 5.8进行试验安装.第一步,我们需 ...
- CentOS开发环境LAMP搭建
CentOS开发环境搭建 -------------------------------------------------------------------------准备工作---------- ...
- 征服 Redis + Jedis + Spring (一)—— 配置&常规操作(GET SET DEL)
有日子没写博客了,真的是忙得要疯掉. 完成项目基础架构搭建工作,解决了核心技术问题,接着需要快速的调研下基于Spring框架下的Redis操作. 相关链接: 征服 Redis 征服 Redis + J ...
- google perftools分析程序性能
Google perftools 1.功能简介 它的主要功能就是通过采样的方式,给程序中cpu的使用情况进行“画像”,通过它所输出的结果,我们可以对程序中各个函数(得到函数之间的调用关系)耗时情况一目 ...
- QT运行时加载UI文件
写QT程序里运行时加载UI文件,代码如下: 点击(此处)折叠或打开 #include "keyboard.h" #include <QtUiTools> #incl ...
- 【转】cocos2d-x 模仿计时器效果,动态增加分数——2013-08-25 16
http://www.cocos2dev.com/?p=90 游戏中要用到分数是动态增加的,而不是瞬间加上去的. bool HelloWorld::init() { if ( !CCLayer::in ...