如何添加使用echats地图悬浮显示内容
/初始化绘制全国地图配置
var option = {
backgroundColor: '#000',
title: {
text: 'Echarts3 中国地图农村金融',
subtext: '三级科技下乡',
link: 'http://www.cnblogs.com/sxz2008/',
left: 'center',
textStyle: {
color: '#fff',
fontSize: 16,
fontWeight: 'normal',
fontFamily: "Microsoft YaHei"
},
subtextStyle: {
color: '#ccc',
fontSize: 13,
fontWeight: 'normal',
fontFamily: "Microsoft YaHei"
}
},
tooltip: { //显示悬浮窗口
trigger: 'item',
//使用这个函数返回悬浮内容
formatter:function(params){
//定义一个res变量来保存最终返回的字符结果,并且先把地区名称放到里面
// var res='随机数字'+'<br />';
var res=params.name+':'+'随机数字'+'<br />';
var myseries=provinces;//省市区
for(var i=0;i<myseries.length;i++){
if(myseries[i].name==params.name){
res+=myseries[i].name+':'+myseries[i].value+'<br />';
}
}
//市区
for(var j=0;j<city.length;j++){
if(city[j].name==params.name){ res+=city[j].name+':'+city[j].value+'<br />';
} }
//县区
for(var k=0;k<area.length;k++){
if(area[k].name==params.name){
res+=area[k].name+':'+area[k].value+'<br />';
}
}
return res;
}, },
toolbox: {
show: true,
orient: 'vertical',
left: 'right',
top: 'center',
feature: {
dataView: {
readOnly: false
},
restore: {},
saveAsImage: {}
},
iconStyle: {
normal: {
color: '#fff'
}
}
},
visualMap: {
type: 'continuous', // 连续型
min: 0, // 值域最小值,必须参数
max: 1200, // 值域最大值,必须参数
calculable: true, // 是否启用值域漫游
inRange: {
color: ['#50a3ba', '#eac736', '#d94e5d']
// 指定数值从低到高时的颜色变化
},
textStyle: {
color: '#fff' // 值域控件的文本颜色
}
}, animationDuration: 1000,
animationEasing: 'cubicOut',
animationDurationUpdate: 1000 };
使用echarts.js 改造git项目能够省市区显示具体内容;主要是json数据和formatter函数返回的值
如何添加使用echats地图悬浮显示内容的更多相关文章
- JS实现鼠标悬浮,显示内容
其实就是增加title属性
- iOS_地图之显示附近微博
1.首先需要新建一个MKMapView地图对象,在storyBoard中拖拽一个,在工程中导入MapKit.framework: 2.遵守MKMapViewDelegate协议,设定显示地 ...
- 百度地图API显示多个标注点并添加百度样式检索窗口
原作者博客地址:http://blog.csdn.net/a497785609/article/details/24009031 在此基础上进行了修改: 1.添加闭包,将i传入内部 2.添加地图和卫星 ...
- [Xcode 实际操作]四、常用控件-(17)为MKMapView地图上显示提示框
目录:[Swift]Xcode实际操作 本文将演示当点击地图上的标注圆点时,弹出信息窗口. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit ...
- 百度地图API显示多个标注点带提示的代码 / 单个标注点带提示代码
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- echarts以地图形式显示中国疫情情况实现点击省份下钻
首先要导入对应的包.下钻用到各个省份的json文件等内容导入之后进行相关的操作. 首先是从数据库中读取相应的数据文件.通过list方式.只有在ser出转化为json文件.在jsp页面通过ajax来进行 ...
- 百度地图API显示多个标注点带检索框
通过百度地图的api,可以在地图上显示多个标注点,并给所有的标注点实现了带检索功能的信息框 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 T ...
- javascript学习内容--改变样式、取消设置、显示内容、隐藏内容
<head> <style> body{font-size:12px;} #txt{ height:400px; width:600px; border:#333 solid ...
- html5定位并在百度地图上显示
在开发移动端 web 或者webapp时,使用百度地图 API 的过程中,经常需要通过手机定位获取当前位置并在地图上居中显示出来,这就需要用到html5的地理定位功能. navigator.geolo ...
随机推荐
- 51Nod.1766.树上最远点对(树的直径 RMQ 线段树/ST表)
题目链接 \(Description\) 给定一棵树.每次询问给定\(a\sim b,c\sim d\)两个下标区间,从这两个区间中各取一个点,使得这两个点距离最远.输出最远距离. \(n,q\leq ...
- [BZOJ3038]遥远的国度
Description: 给定一棵树,每次询问u节点在以v为根时的子树权值最大值 Hint: \(n \le 10^5\) Solution: 这个模型还是很重要的 考虑树剖 以1节点为根建树 当\( ...
- [P2119]魔法阵 (模拟?搜索?)
很玄学 我暴力都没做出来 #include <cstdio> ],vis[],a[],b[],c[],d[]; int main() { //freopen("magic.in& ...
- git常用命令2--- git rebase
git rebase:简单而言就是把某个分支上的提交commit嫁接到另一个commit的后面,在这个过程中这些commit的base相对就改变了,也就叫变基. git rebase <upst ...
- DOM操作技术
1.动态script function loadScript(url) { var script = document.createElement("script"); scrip ...
- day3字典_字符串_文件操作
一.知识回顾 1.jmeter怎样增加压力机:在主控机配置文件 jmeter.perperties 文件中添加对应压力的IP和对应端口,多台压力机IP用","隔开,保证所有负载机和 ...
- java基础知识总结--多线程
1.扩展Java.lang.Thread类 1.1.进程和线程的区别: 进程:每个进程都有自己独立的代码和数据空间(进程上下文),进程间的切换会有较大的开销,一个进程包含1~n个线程. 线程:同一类线 ...
- 改变下blog思维
自言自语 总是希望我写出来的东西都是精品或者尽我的努力使其接近精品,所以写一个就会消耗不少时间. 但是进来实在太忙,就没办法写:以至于断更了一大段时间.所以从现在开始记录一些很简小的东西直到我又开始有 ...
- 11-22 JS中级复习
1.this js的关键字, 用途:指向某一个对象. 如何判断this指向 函数(方法)内 一种以函数的方式调用(不带.) this指向winodw 一种以方法的形式调用(函数名前面带.)this指向 ...
- 2018年东北农业大学春季校赛 I-wyh的物品(二分查找)
链接:https://www.nowcoder.com/acm/contest/93/I来源:牛客网 题目描述 wyh学长现在手里有n个物品,这n个物品的重量和价值都告诉你,然后现在让你从中选取k个, ...