when Vue uses Echarts, the map does not show. Could you tell me how to quote bmap?
?<template>
<div id="HotSpot"></div>
</template>
<script>
export default {
name: "HotSpot", //
data(){
return{
geoCoordMap:[
{name:"",value:[124.37,40.13,355]},
{name:"",value:[121.979603,39.627114,359]},
{name:"",value:[123.97,41.97]},
{name:"",value:[120.836932,40.711052,1563]},
{name:"",value:[122.18,40.65,12]},
{name:"",value:[122.070714,41.119997,658]},
{name:"",value:[121.62,38.92,110]},
{name:"",value:[123.38,41.8,435]},
{name:"",value:[121.15,41.13,152]},
{name:"",value:[123.73,41.3,365]},
{name:"",value:[122.85,41.12,153]},
]
}
},
props: {
},
mounted() {
this.drawChart();
},
methods:{
drawChart(){
// domecharts
let myChart = this.$echarts.init(document.getElementById("HotSpot"));
//
myChart.setOption({
tooltip : {
trigger: "item"
},
bmap: {
center: [104.114129, 37.550339],
zoom: 5,
roam: true,
},
series : [
{
name: "pm2.5",
type: "scatter",
coordinateSystem: "bmap",
data: [
{name:"",value:[124.37,40.13,355]},
{name:"",value:[121.979603,39.627114,359]},
{name:"",value:[123.97,41.97]},
{name:"",value:[120.836932,40.711052,1563]},
{name:"",value:[122.18,40.65,12]},
{name:"",value:[122.070714,41.119997,658]},
{name:"",value:[121.62,38.92,110]},
{name:"",value:[123.38,41.8,435]},
{name:"",value:[121.15,41.13,152]},
{name:"",value:[123.73,41.3,365]},
{name:"",value:[122.85,41.12,153]},
],
symbolSize: function (val) {
return val[2] / 10;
},
label: {
normal: {
formatter: "{b}",
position: "right",
show: false
},
emphasis: {
show: true
}
},
itemStyle: {
normal: {
color: "-sharpddb926"
}
}
},
]
},true);
}
}
}
</script>
<style>
</style>
