1、echarts省市地图上根据数值大小给散点设置不同颜色,地图颜色不根据数值大小渲染,自己设置颜色
<script>
//引入基本模板
let echarts = require('echarts/lib/echarts')
// 引入组件
require('echarts/lib/chart/map')
// 引入地图js文件
require('echarts/map/js/province/jiangsu')
require('echarts/map/js/china')
// 引入提示框
require('echarts/lib/component/tooltip')
// 引入标题组件
require('echarts/lib/component/title')
require('echarts/lib/component/legendScroll')
export default {
data() {
return {
img: require('../assets/img/photovoltaic.png')
}
},
mounted() {
this.mapInit();
},
methods: {
// 分布图
mapInit(){
let myChart=echarts.init(document.getElementById("map"));
let list = [
{
"areaName": "江苏xx",
"cityName":"江苏省",
"confidenceProbability": 0.41,
"latitude": 34.401,
"confidencePower": 20,
"longitude": 119.9526
},
{
"areaName": "江苏南京xx",
"cityName":"南京市",
"confidenceProbability": 50.23,
"latitude": 32.45,
"confidencePower": 20,
"longitude": 118.92
},
{
"areaName": "江苏镇江xx",
"cityName":"镇江市",
"confidenceProbability": 0.8,
"latitude": 32.0888,
"confidencePower": 40,
"longitude": 119.4225
},
{
"areaName": "江苏常州xx",
"cityName":"常州市",
"confidenceProbability": 12.4,
"latitude": 31.92,
"confidencePower": 120,
"longitude": 119.99
},
{
"areaName": "江苏无锡xx",
"cityName":"无锡市",
"confidenceProbability": 13.53,
"latitude": 31.5591,
"confidencePower": 80,
"longitude": 120.4113
},
{
"areaName": "江苏苏州xx",
"cityName":"苏州市",
"confidenceProbability": 8.47,
"latitude": 31.55,
"confidencePower": 139,
"longitude": 120.817
},
{
"areaName": "江苏徐州xx",
"cityName":"徐州市",
"confidenceProbability": 63,
"latitude": 34.0814,
"confidencePower": 100,
"longitude": 117.9255
},
{
"areaName": "江苏泰州xx",
"cityName":"泰州市",
"confidenceProbability": 11.8,
"latitude": 33.16,
"confidencePower": 120,
"longitude": 120.16
},
{
"areaName": "江苏南通xx",
"cityName":"南通市",
"confidenceProbability": 30.69,
"latitude": 32.06,
"confidencePower": 47,
"longitude": 121.03
},
{
"areaName": "江苏淮安xx",
"cityName":"淮安市",
"confidenceProbability": 0.64,
"latitude": 33.56,
"confidencePower": 160,
"longitude": 119.18
},
{
"areaName": "江苏盐城xx",
"cityName":"盐城市",
"confidenceProbability": 32.9,
"latitude": 33.5189,
"confidencePower": 200,
"longitude": 120.2789
},
{
"areaName": "江苏连云港xx",
"cityName":"连云港市",
"confidenceProbability": 34.8,
"latitude": 34.117,
"confidencePower": 0,
"longitude": 119.3315
},
{
"areaName": "江苏宿迁xx",
"cityName":"宿迁市",
"confidenceProbability": 45.6,
"latitude": 33.739,
"confidencePower": 0,
"longitude": 118.757
},
{
"areaName": "江苏扬州xx",
"cityName":"扬州市",
"confidenceProbability": 87.5,
"latitude": 33.13,
"confidencePower": 0,
"longitude": 119.38
}
];
let data = [];
let map = [];
list.forEach((item) => {
if (item.cityName== "江苏省") {
return;
}
data.push(
{
value: [item.longitude, item.latitude, item.confidencePower],
name: item.areaName,
data: [item.confidencePower, item.confidenceProbability]
}
)
map.push({
name: item.cityName,
value: item.confidencePower,
data: [item.confidencePower, item.confidenceProbability]
})
});
let