如何更好的使用Echarts,做好地图?
来源:互联网 发布:目前就业形势 数据分析 编辑:程序博客网 时间:2024/05/18 10:03
首先去echarts官网定制你需要的模块。
http://echarts.baidu.com/builder.html
下载
下载完成会生成一个echarts.min.js
再去echarts官网上下载相应的地图js,json
http://echarts.baidu.com/download-map.html
将对应得JS/JSON文件下载下来会生成china.js/china.json
最后在项目中引入
html代码如下:
完成 效果:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
#main{
width: 500px;
height: 500px;
border:1px solid #000;
}
</style>
</head>
<body>
<div id="main"></div>
<script src="echarts.min.js"></script>
<script src="map/js/china.js"></script>
<script>
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
$.get('map/json/china.json', function (chinaJson) {
echarts.registerMap('china', chinaJson);
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
});
</script>
</body>
</html>
- 如何更好的使用Echarts,做好地图?
- ECharts地图使用
- Echarts地图使用扩展
- 如何更好的使用google
- 如何更好的使用JTextPane
- 如何更好的使用搜索引擎
- echarts地图的引用
- vue如何引入echarts地图
- 什么是Echarts?Echarts如何使用?
- 如何解决echarts地图只出现南海部分的问题
- ECharts地图API使用实例
- 关于百度echarts map地图的使用之分布图
- 如何更好的做好网站外链 介绍获得外链的一些方法
- 『IT视界』 [IT风云]如何更好的做好软件测试(转载)
- 如何更好的理解和使用Github
- 如何更好的使用今目标
- 如何更好的使用Oracle全文索引
- 关于Echarts渲染地图(不创建地图实例)如何修改基础配置的方法
- ios开发经验总结
- 我一行代码都不写实现Toolbar!你却还在封装BaseActivity?
- C/C++ sizeof函数解析——解决sizeof求结构体大小的问题
- 管道流
- 在接口中实现
- 如何更好的使用Echarts,做好地图?
- DIY使用Arduino给3D打印机增加完事后自动关机功能
- Nginx开发从入门到精通
- orcle用户授权
- FIN7 APT组织攻击木马分析报告
- 非常实用的15款开源PHP类库
- 线程协作
- 内容提供者
- ssm分页