setOption debug
This commit is contained in:
parent
acb1f89b0a
commit
edd7469ef2
@ -27,7 +27,12 @@ async function updateSvg(svg, option) {
|
|||||||
axios.get(svg.path).then(async ({ data }) => {
|
axios.get(svg.path).then(async ({ data }) => {
|
||||||
echarts.registerMap(svg.full_name, { svg: data });
|
echarts.registerMap(svg.full_name, { svg: data });
|
||||||
await nextTick();
|
await nextTick();
|
||||||
chart.value.setOption(option);
|
// 延遲執行以避免在主進程中調用 setOption
|
||||||
|
setTimeout(() => {
|
||||||
|
if (chart.value && !chart.value.isDisposed()) {
|
||||||
|
chart.value.setOption(option);
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
if (props.getCoordinate) {
|
if (props.getCoordinate) {
|
||||||
chart.value.getZr().on("click", function (params) {
|
chart.value.getZr().on("click", function (params) {
|
||||||
var pixelPoint = [params.offsetX, params.offsetY];
|
var pixelPoint = [params.offsetX, params.offsetY];
|
||||||
@ -45,11 +50,15 @@ async function updateSvg(svg, option) {
|
|||||||
value: dataPoint, // 當前座標值
|
value: dataPoint, // 當前座標值
|
||||||
itemStyle: { color: "#0000FF" }, // 設為藍色
|
itemStyle: { color: "#0000FF" }, // 設為藍色
|
||||||
});
|
});
|
||||||
chart.value.setOption({
|
setTimeout(() => {
|
||||||
series: {
|
if (chart.value && !chart.value.isDisposed()) {
|
||||||
data: updatedData,
|
chart.value.setOption({
|
||||||
},
|
series: {
|
||||||
});
|
data: updatedData,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -37,7 +37,9 @@ watch(
|
|||||||
formState.value.building_guid = newBuilding.building_guid;
|
formState.value.building_guid = newBuilding.building_guid;
|
||||||
imgBaseUrl.value = store.previewImageExt
|
imgBaseUrl.value = store.previewImageExt
|
||||||
? `${FILE_BASEURL}/upload/setting/previewImage/${newBuilding.building_guid}${store.previewImageExt}`
|
? `${FILE_BASEURL}/upload/setting/previewImage/${newBuilding.building_guid}${store.previewImageExt}`
|
||||||
: "";
|
: import.meta.env.MODE === "production"
|
||||||
|
? "dist/build_img.jpg"
|
||||||
|
: "/build_img.jpg";
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ immediate: true, deep: true }
|
{ immediate: true, deep: true }
|
||||||
@ -111,7 +113,7 @@ onUnmounted(() => {
|
|||||||
<!-- setting頁面要新增讓他能上傳圖片 -->
|
<!-- setting頁面要新增讓他能上傳圖片 -->
|
||||||
<img
|
<img
|
||||||
alt="build"
|
alt="build"
|
||||||
:src="imgBaseUrl || '/build_img.jpg'"
|
:src="imgBaseUrl"
|
||||||
:class="
|
:class="
|
||||||
twMerge(
|
twMerge(
|
||||||
'absolute w-full h-full transition-opacity duration-300',
|
'absolute w-full h-full transition-opacity duration-300',
|
||||||
|
@ -132,7 +132,9 @@ watch(
|
|||||||
getData();
|
getData();
|
||||||
imgBaseUrl.value = buildingStore.previewImageExt
|
imgBaseUrl.value = buildingStore.previewImageExt
|
||||||
? `${FILE_BASEURL}/upload/setting/previewImage/${newBuilding.building_guid}${buildingStore.previewImageExt}`
|
? `${FILE_BASEURL}/upload/setting/previewImage/${newBuilding.building_guid}${buildingStore.previewImageExt}`
|
||||||
: "";
|
: import.meta.env.MODE === "production"
|
||||||
|
? "dist/build_img.jpg"
|
||||||
|
: "/build_img.jpg";
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -368,7 +370,7 @@ onUnmounted(() => {
|
|||||||
<div class="h-full relative">
|
<div class="h-full relative">
|
||||||
<img
|
<img
|
||||||
alt="build"
|
alt="build"
|
||||||
:src="imgBaseUrl || '/build_img.jpg'"
|
:src="imgBaseUrl"
|
||||||
:class="
|
:class="
|
||||||
twMerge(
|
twMerge(
|
||||||
'absolute w-full h-full transition-opacity duration-300',
|
'absolute w-full h-full transition-opacity duration-300',
|
||||||
|
@ -70,18 +70,19 @@ const defaultOption = (map, data = []) => {
|
|||||||
watch(
|
watch(
|
||||||
realtimeData,
|
realtimeData,
|
||||||
() => {
|
() => {
|
||||||
nextTick(() => {
|
setTimeout(() => {
|
||||||
if (
|
if (
|
||||||
selectedFloor.value &&
|
selectedFloor.value &&
|
||||||
asset_floor_chart.value &&
|
asset_floor_chart.value &&
|
||||||
asset_floor_chart.value.chart
|
asset_floor_chart.value.chart &&
|
||||||
|
asset_floor_chart.value.chart.isDisposed() === false
|
||||||
) {
|
) {
|
||||||
asset_floor_chart.value.chart.setOption(
|
asset_floor_chart.value.chart.setOption(
|
||||||
defaultOption(selectedFloor.value?.title, selectedData.value),
|
defaultOption(selectedFloor.value?.title, selectedData.value),
|
||||||
true
|
true
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
}, 0);
|
||||||
},
|
},
|
||||||
{ deep: true }
|
{ deep: true }
|
||||||
);
|
);
|
||||||
@ -150,18 +151,23 @@ watch(
|
|||||||
if (
|
if (
|
||||||
selectedFloor.value &&
|
selectedFloor.value &&
|
||||||
asset_floor_chart.value &&
|
asset_floor_chart.value &&
|
||||||
asset_floor_chart.value.chart
|
asset_floor_chart.value.chart &&
|
||||||
|
asset_floor_chart.value.chart.isDisposed() === false
|
||||||
) {
|
) {
|
||||||
const selected = allData.value.filter((d) => d[2].is2DActive);
|
const selected = allData.value.filter((d) => d[2].is2DActive);
|
||||||
const unSelected = allData.value.filter((d) => !d[2].is2DActive);
|
const unSelected = allData.value.filter((d) => !d[2].is2DActive);
|
||||||
asset_floor_chart.value.chart.setOption({
|
setTimeout(() => {
|
||||||
series: [
|
if (asset_floor_chart.value?.chart && !asset_floor_chart.value.chart.isDisposed()) {
|
||||||
{ data: unSelected },
|
asset_floor_chart.value.chart.setOption({
|
||||||
{
|
series: [
|
||||||
data: selected,
|
{ data: unSelected },
|
||||||
},
|
{
|
||||||
],
|
data: selected,
|
||||||
});
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -188,14 +194,18 @@ watch(
|
|||||||
const unSelected = selectedData.value.filter((d) => !d[2].is2DActive);
|
const unSelected = selectedData.value.filter((d) => !d[2].is2DActive);
|
||||||
|
|
||||||
console.log("allData.value", allData.value, selected, unSelected);
|
console.log("allData.value", allData.value, selected, unSelected);
|
||||||
asset_floor_chart.value.chart.setOption({
|
setTimeout(() => {
|
||||||
series: [
|
if (asset_floor_chart.value?.chart && !asset_floor_chart.value.chart.isDisposed()) {
|
||||||
{ data: unSelected },
|
asset_floor_chart.value.chart.setOption({
|
||||||
{
|
series: [
|
||||||
data: selected,
|
{ data: unSelected },
|
||||||
},
|
{
|
||||||
],
|
data: selected,
|
||||||
});
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
Loading…
Reference in New Issue
Block a user