高分求javascript高手解决jvectormap中国地图问题,要求地图显示省份名称,点击省份可跳转指定连接。

JavaScript015

高分求javascript高手解决jvectormap中国地图问题,要求地图显示省份名称,点击省份可跳转指定连接。,第1张

当时遇到这个地图也是花了一些功夫解决了点击跳转的需求,当时是实现了效果,但没有优化,提供给你参考。

这个地图插件依据浏览器不同,生成的地图代码不同,建议多测试一下。

在脚本最后注释的那个 alert就是click事件,自行替换即可。

实际的参考网站在百度发不出来地址,需要可以私信我。

//数据可以动态生成,格式自己定义,cha对应china-zh.js中省份的简称    

var dataStatus = [{ cha: 'HKG', name: '香港', des: '' },    

{ cha: 'HAI', name: '海南', des: '' },    

{ cha: 'YUN', name: '云南', des: '<br/>' },    

{ cha: 'BEJ', name: '北京', des: '<br/>' },    

{ cha: 'TAJ', name: '天津', des: '<br/>' },    

{ cha: 'XIN', name: '新疆', des: '' },    

{ cha: 'TIB', name: '西藏', des: '' },    

{ cha: 'QIH', name: '青海', des: '' },    

{ cha: 'GAN', name: '甘肃', des: '<br/>' },    

{ cha: 'NMG', name: '内蒙古', des: '<br/>' },    

{ cha: 'NXA', name: '宁夏', des: '<br/>' },    

{ cha: 'SHX', name: '山西', des: '<br/>' },    

{ cha: 'LIA', name: '辽宁', des: '<br/>' },    

{ cha: 'JIL', name: '吉林', des: '<br/>' },    

{ cha: 'HLJ', name: '黑龙江', des: '<br/>' },    

{ cha: 'HEB', name: '河北', des: '<br/>' },    

{ cha: 'SHD', name: '山东', des: '<br/>' },    

{ cha: 'HEN', name: '河南', des: '<br/>' },    

{ cha: 'SHA', name: '陕西', des: '' },    

{ cha: 'SCH', name: '四川', des: '<br/>' },    

{ cha: 'CHQ', name: '重庆', des: '' },    

{ cha: 'HUB', name: '湖北', des: '<br/>' },    

{ cha: 'ANH', name: '安徽', des: '<br/>' },    

{ cha: 'JSU', name: '江苏', des: '<br/>' },    

{ cha: 'SHH', name: '上海', des: '' },    

{ cha: 'ZHJ', name: '浙江', des: '<br/>' },    

{ cha: 'FUJ', name: '福建', des: '' },    

{ cha: 'TAI', name: '台湾', des: '' },    

{ cha: 'JXI', name: '江西', des: '' },    

{ cha: 'HUN', name: '湖南', des: '' },    

{ cha: 'GUI', name: '贵州', des: '' },    

{ cha: 'GXI', name: '广西', des: '<br/>' },    

{ cha: 'GUD', name: '广东', des: '<br/>'}]    

$('#container').vectorMap({ map: 'china_zh',    

color: "#95cee9", //地图颜色    

onLabelShow: function (event, label, code) {//动态显示内容    

$.each(dataStatus, function (i, items) {    

if (code == items.cha) {    

label.html(items.name + items.des)    

}    

})    

}    

})    

    

var hasNum = new Array()    

$.each(dataStatus, function (i, items) {    

if (items.des.indexOf('br') != -1) {//动态设定颜色,此处用了自定义简单的判断    

var josnStr = "{" + items.cha + ":'#1c84b7'}"    

hasNum.push(items.cha)    

$('#container').vectorMap('set', 'colors', eval('(' + josnStr + ')'))    

}    

})    

$('.jvectormap-zoomin').click() //放大    

    

    

    

$('#container').find("*[id*='jvectormap1']").each(function(){    

var _this = $(this)    

var _thisid = $(this).attr('id')    

for (var i=0 i<hasNum.length i++){    

if(_thisid.indexOf(hasNum[i]) != -1){    

_this.click(function(){    

//alert(_thisid)    

})    

}    

}    

})

javascript呼叫百度地图怎么获取所有省会城市的地标资讯?

在中国地图上手动搜寻出城市座标

建立若干Label,然后将地标的名称和经纬度传入,再呼叫map的addOverlay放到地图上

百度地址没有直接的api可以实现你的要求

即使是向地图发起搜寻“省会”2个字也不行

百度地图怎么获取城市的编码cityCode

在BMK Geocode Search Delegate 的方法里面有这个

- (void)onGetReverseGeocodeResult[图片]BMKGeocodeSearch *)searcher

result[图片]BMKReverseGeoCodeResult *)result

errorCode[图片]BMKSearchErrorCode)error{

NSString *cityName = result.addressDetail.city},这样即可获取到城市的名称。

从省到市,从市取到区,android上好像没有对应的API,不过可以通过javascript的介面来实现,具体说明如下: 省不用说了,不需要介面都可以取得到列表。 市的话要根据省来取,具体如下: 用android的HttpGet等方法(联网的方法网上都有)

百度地图API是为开发者免费提供的一套基于百度地图服务的应用介面,包括JavaScript API、Web服务API、Android SDK、iOS SDK、定位SDK、车联网API、LBS云等多种开发工具与服务,提供基本地图展现、搜寻、定位、逆/地理编码、路线规划、LBS云端储存与检索等功能,适用于PC端、移动端、伺服器等多种装置,多种作业系统下的地图应用开发。

js百度地图怎么获取城市编码?

百度地图里的geocoder

:api.map.baidu./geocoder/v2/?ak=你的ak值&location=47.358015,123.970903&output=json

返回结果里有个 cityCode

百度地图如何获取路况资讯

这个问题我在知乎提过,有的说通过卫星,有的说通过交通系统

中国地图,只要省会和主要城市的。A4纸列印用,不要给我百度地图,google地图。

发你邮箱里了,查收啊~~~

怎样使用百度地图Android SDK将多个座标资讯同时显示在地图上

就是显示多个标而已,向map中增加多个覆盖物,百度的demo不是有一个就是增加标注,增加覆盖物的,有现成的程式码,不要问别人了,直接下载百度map的开发示例吧。怎样使用百度地图Android SDK将多个座标资讯同时显示在地图上

echarts3加载map的方式和2不一样了,你必须得先注册地图才行,

“`js$.getJSON(‘./china.json’, function (data) { echarts.registerMap(‘china’

, data) var chart = echarts.init(document.getElementById(‘map’)) chart.setOp

tion({ series: [{ type: ‘map’, map: ‘china’ }] }) })“`

类似这样,你需要下载中国的地理矢量数据geojson

echarts3与echarts2区别:

1、js文件:

首先是js文件,echarts3做了很大的优化,在echarts2中,对各种控件的类库管理的较为详

细,有专门的目录结构来存放相关的js文件及相关资源,但是在引入文件的时候往往会很不

方便,可能会一不小心就漏掉一个文件,而echarts3可以根据需要在下载项下直接根据所需

的功能构架类库,使用时只要导入一个echarts.min.js文件就可以;

2、文件导入:

在echarts2中,require是作为模块化加载的入口,在使用过程中关于路径配置经常会出现

问题,特别是制作地图的时候,而在echarts3中只需要在开头加一句[html] view plain copy

<script src="js/echarts.js"></script>  接下去只要调用接口就可以了;

3、离线地图:

echarts2中离线地图的精确度存在很大的问题,特别是下钻到区县一级,边界线存在

模糊、交叉、空白等问题,并且经常出现飞地,与实际地图出入较大,个人认为基本没

什么用,在echarts3中对此做了很大的改进,基本解决了以上问题,市与市之间、区县

与区县之间基本上不存在衔接问题;另外,在echarts3中可以根据需要自主构建地图,

这个服务给实际使用提供了很大的便利;

4、工具栏:

在echarts3的toolbox里面把辅助线功能取消掉了,图标变小了,总体上感觉echarts3

里面的toolbox更丑了;

5、地图漫游工具:

在echarts3里面把地图漫游工具取消掉了,说实话,echarts2里面的地图漫游工具看着

还是挺不错的,虽然并没有什么用;

6、坐标系:

echarts3中,数据结构进行了统一化抽象,最常用的数据结构有:线性表、树、图。例

如,线性表以及树、图的节点列表的结构可以归一化为这样的二维数组;echarts3中另

一个重要的数据结构抽象是独立出了“坐标系”概念;事实上在 ECharts2 中已经有

grid、polar配置项存在,但是并不是按一个“坐标系”的理解去实现的;echarts3中,

支持了直角坐标系(catesian,兼容 echarts2中的grid)、极坐标系(polar)、地理

坐标系(geo);

7、Option变动:

1)组件位置想x、y等变成了left、top,可以使用像素和百分比,适应性更强。

2)为了让结构更合理,echarts3中label被移出来和itemStyle平级。

根据官方说法,在echarts3中以前的用法也是兼容的,只是不推荐。

参考资料

echarts3与echarts2区别.CSDN[引用时间2018-1-22]