function analyseJSON(url, callback) {
let request = new XMLHttpRequest();
request.open("get", url);
request.send(null);
request.onload = function () {
if (request.status == 200) {
callback(request.responseText);
}
}
}
//注册地图
echarts.registerMap("绍兴", getJSON);
//3D地图渲染
analyseJSON('./绍兴区县.json', function (getJSON) {
var myChart = echarts.init(document.getElementById('id'));
echarts.registerMap("绍兴", getJSON);
let inputData = [565464, 117230.34, 74130.95, 41375.41, 43099.39, 127574.2, 86198.78, 75854.93];
let data2 = [{
name: '越城区',
value: inputData[2],
itemStyle: {
color: '#e78078',
},
},
{
name: '柯桥区',
value: inputData[3],
itemStyle: {
color: '#3f93d3',
},
},
{
name: '上虞区',
value: inputData[4],
itemStyle: {
color: '#98a3af',
},
},
{
name: '新昌县',
value: inputData[5],
itemStyle: {
color: '#12c0ae',
},
}];
let option = {
tooltip: {
trigger: 'item',
formatter: function (params) {
return params.name + ":" + params.value;
}
},
series: [{
name: '绍兴',
type: 'map3D',
map: '绍兴',
boxDepth: 100, //地图倾斜度
regionHeight: 2, //地图厚度
light: {
main: {
intensity: 1.5
}
},
label: {
show: true, //是否显示市
textStyle: {
color: "#333333", //文字颜色
fontSize: 16, //文字大小
fontFamily: '微软雅黑',
backgroundColor: "rgba(0,0,0,0)", //透明度0清空文字背景
},
},
data: data2,
itemStyle: {
opacity: 1, // 透明度
borderWidth: 1, //分界线宽度
borderColor: "#808080", //分界线颜色
color: "#ffffff"
},
emphasis: {
itemStyle: {
color: "#D3D3D3"
},
},
groundplane: {
show: false
},
shading: 'realistic',
realisticMaterial: {
detailTexture: '#fff', // 纹理贴图
textureTiling: 1, // 纹理平铺,1是拉伸,数字表示纹理平铺次数
roughness: 0, // 材质粗糙度,0完全光滑,1完全粗糙
metalness: 0, // 0材质是非金属 ,1金属
roughnessAdjust: 0
},
viewControl: {
distance: 135, // 地图视角 控制初始大小
rotateSensitivity: 1, // 旋转
zoomSensitivity: 1, // 缩放
},
}],
};
myChart.setOption(option);
});