问题:L.supermap.echartsLayer报错_echarts2.default.init is not a function
iclient-leaflet版本v9.1.2
leaflet版本1.3.1
框架采用vue,leaflet引入方式为
import L from 'leaflet'
import 'leaflet/dist/leaflet.css'
Vue.use(L)
iclient-leaflet引入方式为等leaflet引入后 引入
export const loadJs = (url, callback) => {
var script = document.createElement('script');
script.type = "text/javascript";
if (typeof (callback) != "undefined") {
if (script.readyState) {
script.onreadystatechange = function () {
if (script.readyState == "loaded" || script.readyState == "complete") {
script.onreadystatechange = null;
callback();
}
}
} else {
script.onload = function () {
callback();
}
}
}
script.src = url;
document.body.appendChild(script);
}
// 引入静态的leaflet
loadJs("./static/libs/leaflet/iclient9-leaflet.js")
创建L.supermap.echartsLayer的部分代码
createLayer(map, data, getnextClustData) {
if (!map) {
return
}
if (!data) {
return
}
let minobj = this.getSymbolSize(data)
this.activeMap = map
const option = {
color: colorPicker.color,
tooltip: {
trigger: 'item',
formatter(a) {
return `${a.name}: ${a.value[2]}`
}
},
series: [{
name: data.name ? data.name : '',
type: 'scatter',
coordinateSystem: 'leaflet',
data: data.data,
symbolSize(val) {
// 大小在40至65之间
let size = 0
if (minobj.arr.length == 1) {
size = 65
} else {
let a = (val[2] - minobj.min) * 25
let b = a / (minobj.max - minobj.min)
size = Number(b) + 40
}
return size
},
label: {
show: true,
position: 'bottom',
color: data.color ? data.color : (colorPicker.gather.itemColor ? colorPicker.gather.itemColor : '#fff'),
formatter: '{b}'
},
showEffectOn: 'emphasis',
effectType: 'ripple',
rippleEffect: {
brushType: 'stroke'
},
hoverAnimation: true,
itemStyle: {
color: data.color ? data.color : colorPicker.gather.itemColor,
borderWidth: data.borderWidth ? data.borderWidth : 2,
borderColor: data.borderColor ? data.borderColor : colorPicker.gather.borderColor,
opacity: data.opacity ? data.opacity : 0.8
},
emphasis: {
itemStyle: {
shadowColor: data.borderColor ? data.borderColor : colorPicker.gather.shadowColor,
shadowBlur: 20
}
}
}, {
name: data.name ? data.name : '',
type: 'scatter',
coordinateSystem: 'leaflet',
data: data.data,
symbolSize: 20,
symbolSize(val) {
// 大小在40至65之间
let size = 0
if (minobj.arr.length == 1) {
size = 65
} else {
let a = (val[2] - minobj.min) * 25
let b = a / (minobj.max - minobj.min)
size = Number(b) + 40
}
return size
},
label: {
show: true,
position: 'inside',
color: data.color ? data.color : (colorPicker.gather.insideColor ? colorPicker.gather.insideColor : '#fff'),
formatter(a) {
let par = a.value[2]
// par = par.substr(0, 1);
return par
}
},
showEffectOn: 'emphasis',
effectType: 'ripple',
rippleEffect: {
brushType: 'stroke'
},
hoverAnimation: true,
itemStyle: {
color: data.color ? data.color : colorPicker.gather.itemColor,
borderWidth: data.borderWidth ? data.borderWidth : 3,
borderColor: data.borderColor ? data.borderColor : colorPicker.gather.borderColor,
opacity: data.opacity ? data.opacity : 1
},
emphasis: {
itemStyle: {
shadowColor: data.borderColor ? data.borderColor : colorPicker.gather.shadowColor,
shadowBlur: 20
}
}
}]
}
this.graph = {
shadowColor: data.borderColor ? data.borderColor : colorPicker.gather.shadowColor,
color: data.color ? data.color : colorPicker.gather.itemColor,
borderColor: data.borderColor ? data.borderColor : colorPicker.gather.borderColor
}
// 记录echartOption,方便自定义颜色
this.echartOption = option
// 清除上一次的专题图
if (this.clusterLayer.hasOwnProperty('_leaflet_id')) {
this.clusterLayer.remove()
}
this.clusterLayer = L.supermap.echartsLayer(option).addTo(map)
},