预览用的是3.0版本 所以不会出问题
使用 https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.js 时
data: [{name:"贵阳市",value:[106.713478,26.578343,120]}]
原本的值 120 地图会显示 26.578343
配置项如下
var guizhou = "/asset/get/s/data-1551855765858-XEoSCwurT.json";
//预览用的是3.0版本 所以不会出问题
//使用 https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts.js 时
// data: [{name:"贵阳市",value:[106.713478,26.578343,120]}]
//原本的值 120 地图会显示 26.578343
echarts.extendsMap = function(id, opt) {
// 实例
var chart = this.init(document.getElementById(id));
var cityMap = {
'贵州': guizhou,
};
var defaultOpt = {
mapName: 'guizh4ou', // 地图展示
goDown: false, // 是否下钻
bgColor: '#ff0', // 画布背景色
activeArea: [], // 区域高亮,同echarts配置项
data: [],
// 下钻回调(点击的地图名、实例对象option、实例对象)
callback: function(name, option, instance) {}
};
if (opt) opt = this.util.extend(defaultOpt, opt);
var handleEvents = {
// 设置effectscatter
initSeriesData: function(data) {
var temp = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
temp.push({
name: data[i].name,
value: geoCoord.concat(data[i].value),
crew:data[i].crew,
company:data[i].company,
position:data[i].position,
region:data[i].region
});
}
};
return temp;
},
};
var option = {
backgroundColor: '#4f5555',
geo: {
map: opt.mapName,
label: {
normal: {
show: true,
textStyle: {
color: '#fff'
}
},
emphasis: {
textStyle: {
color: '#fff'
}
}
},
itemStyle: {
normal: {
borderColor: 'rgba(147, 235, 248, 1)',
borderWidth: 1,
areaColor: {
type: 'radial',
x: 0.5,
y: 0.5,
r: 0.8,
colorStops: [{
offset: 0,
color: 'rgba(147, 235, 248, 0)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(147, 235, 248, .2)' // 100% 处的颜色
}],
globalCoord: false // 缺省为 false
},
shadowColor: 'rgba(128, 217, 248, 1)',
// shadowColor: 'rgba(255, 255, 255, 1)',
shadowOffsetX: -2,
shadowOffsetY: 2,
shadowBlur: 10
},
emphasis: {
areaColor: '#389BB7',
borderWidth: 0
}
},
},
//这里控制地图上的点
series: [{
name: '点',
type: 'scatter',
coordinateSystem: 'geo',
symbol: 'pin',
symbolSize: 25,
label: {
normal: {
show: true,
textStyle: {
color: '#fff',
fontSize: 9,
}
}
},
itemStyle: {
normal: {
color: '#F62157', //标志颜色
}
},
zlevel: 6,
data: [{name:"贵阳市",value:[106.713478,26.578343,120]}]
}]
};
chart.setOption(option);
chart.setMap = function(mapName) {
var _self = this;
if (mapName.indexOf('市') < 0) mapName = mapName + '市';
var citySource = cityMap[mapName];
if (citySource) {
var url = './map/' + citySource + '.json';
$.get(url, function(response) {
// console.log(response);
curGeoJson = response;
echarts.registerMap(mapName, response);
handleEvents.resetOption(_self, option, mapName);
});
}
};
return chart;
};
$.getJSON(guizhou, function(geoJson) {
echarts.registerMap('贵州', geoJson);
var myChart = echarts.extendsMap('chart-panel', {
bgColor: '#154e90', // 画布背景色
mapName: '贵州', // 地图名
});
})