fix(图表): 修复地图区域选择框丢失

This commit is contained in:
wisonic-s 2024-03-14 15:39:05 +08:00
parent a455851608
commit 650101652d
4 changed files with 12 additions and 8 deletions

View File

@ -205,17 +205,17 @@ watch(
if (showAxis('area')) {
if (!state.worldTree?.length) {
getWorldTree().then(res => {
state.worldTree = [res.data]
state.worldTree.splice(0, state.worldTree.length, res.data)
state.areaId = view.value?.customAttr?.map?.id
})
} else {
state.areaId = view.value?.customAttr?.map?.id
}
areaSelect.value?.blur()
expandKeys.value = []
areaSelect.value?.setCurrentKey(state.areaId, state.areaId)
expandKeys.value.splice(0)
areaSelect.value?.setCurrentKey(state.areaId)
}
state.chartTypeOptions = [getViewConfig(newVal[0])]
state.chartTypeOptions.splice(0, state.chartTypeOptions.length, getViewConfig(newVal[0]))
state.useless = newVal[0]
},
{ immediate: true, deep: false }

View File

@ -104,7 +104,6 @@ export class BubbleMap extends L7PlotChartView<ChoroplethOptions, Choropleth> {
view.once('loaded', () => {
view.addLayer(dotLayer)
view.on('fillAreaLayer:click', (ev: MapMouseEvent) => {
console.log(view)
const data = ev.feature.properties
action({
x: ev.x,
@ -120,14 +119,14 @@ export class BubbleMap extends L7PlotChartView<ChoroplethOptions, Choropleth> {
}
private getDotLayer(chart: Chart, data: any[], geoJson: FeatureCollection): IPlotLayer {
const areaMap = data.reduce((obj, value) => {
const areaMap = data?.reduce((obj, value) => {
obj[value['field']] = value.value
return obj
}, {})
const dotData = []
geoJson.features.forEach(item => {
const name = item.properties['name']
if (areaMap[name]) {
if (areaMap?.[name]) {
dotData.push({
x: item.properties['centroid'][0],
y: item.properties['centroid'][1],

View File

@ -41,6 +41,7 @@ export const MAP_EDITOR_PROPERTY_INNER: EditorPropertyInner = {
export const MAP_AXIS_TYPE: AxisType[] = [
'xAxis',
'yAxis',
'area',
'drill',
'filter',
'extLabel',

View File

@ -150,6 +150,7 @@ const country = ref('')
const appStore = useAppStoreWithOut()
const isDataEaseBi = computed(() => appStore.getIsDataEaseBi)
let mapTimer
const chartContainer = ref<HTMLElement>(null)
const renderL7Plot = (chart, chartView: L7PlotChartView<any, any>, callback?) => {
const map = parseJson(chart.customAttr).map
let areaId = map.id
@ -160,6 +161,9 @@ const renderL7Plot = (chart, chartView: L7PlotChartView<any, any>, callback?) =>
mapTimer && clearTimeout(mapTimer)
mapTimer = setTimeout(async () => {
myChart?.destroy()
if (chartContainer.value) {
chartContainer.value.textContent = ''
}
myChart = await chartView.drawChart({
chartObj: myChart,
container: containerId,
@ -301,7 +305,7 @@ onBeforeUnmount(() => {
:style="state.trackBarStyle"
@trackClick="trackClick"
/>
<div v-if="!isError" class="canvas-content" :id="containerId"></div>
<div v-if="!isError" ref="chartContainer" class="canvas-content" :id="containerId"></div>
<chart-error v-else :err-msg="errMsg" />
</div>
</template>