*注:单纯觉得自己该记录一下
/**hlj.json地址**/
https://gitee.com/hyyyhuoyang/hlj.-geo-json-multi-polygon/raw/master/hlj.json
const myChart = echarts.init(document.getElementById('map'));
const uploadedDataURL = /hlj.json";
const center = {
"哈尔滨市": [126.642464, 45.756967],
"齐齐哈尔市": [123.95792, 47.342081],
"牡丹江市": [129.618602, 44.582962],
"佳木斯市": [130.361634, 46.809606],
"大庆市": [125.11272, 46.590734],
"鸡西市": [130.975966, 45.300046],
"伊春市": [128.899396, 47.724775],
"双鸭山市": [131.157304, 46.643442],
"七台河市": [131.015584, 45.771266],
"绥化市": [126.99293, 46.637393],
"鹤岗市": [130.277487, 47.332085],
"黑河市": [127.499023, 50.249585],
"大兴安岭地区": [124.711526, 52.335262]
}
const option = null;
$.get(uploadedDataURL, function (json) {
echarts.registerMap('js', json);
option = {
visualMap: {
show: false,
max: 100,
seriesIndex: [1],
},
geo: [{
map: 'js',
roam: false, //是否允许缩放
zoom: 1, //默认显示级别
top: '5%',
left: '7%',
bottom: '3%',
scaleLimit: {
min: 0,
max: 3
}, //缩放级别
itemStyle: {
normal: {
areaColor: '#d35442',
// shadowColor: '#fefcf9',
// shadowBlur: 20,
// shadowOffsetX: -5,
// shadowOffsetY: 15,
}
},
tooltip: {
show: false
}
}],
series: [
//地图
{
type: 'map',
mapType: 'js',
geoIndex: -1,
zoom: 1, //默认显示级别
top: '5%',
left: '7%',
bottom: '3%',
label: {
show: true,
color: '#313131',
emphasis: {
color: '#fef0e4',
show: false
},
fontSize: 16,
},
itemStyle: {
normal: {
borderColor: '#d35442',
borderWidth: 1,
areaColor: '#fefcf9'
},
emphasis: {
areaColor: 'rgba(254,240,228, 0.2)',
borderWidth: 0,
}
},
data: Object.keys(center).map(name => {
return {
name: name,
value: Math.random() * 100
}
})
}
]
};
myChart.setOption(option);
//绑定点击事件,这里是新窗口打开地址
myChart.on('click', function (param) {
let url = {
哈尔滨市: "",
齐齐哈尔市: "",
牡丹江市: "",
佳木斯市: "",
大庆市: "",
鸡西市: "",
双鸭山市: "",
七台河市: "",
伊春市: "",
绥化市: "",
鹤岗市: "",
黑河市: "",
大兴安岭地区: ""
};
if (param.name === '') {
return false;
}
window.open(url[param.name]);
});
// 地图双击方法
myChart.on('dblclick', function (param) {
let url = {
哈尔滨市: "",
齐齐哈尔市: "",
牡丹江市: "",
佳木斯市: "",
大庆市: "",
鸡西市: "",
双鸭山市: "",
七台河市: "",
伊春市: "",
绥化市: "",
鹤岗市: "",
黑河市: "",
大兴安岭地区: ""
};
window.open(url[param.name]);
});
window.addEventListener('resize', () => {
myChart.resize();
});
});
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。