zouyaoji
commented
1 year ago Please change lineMaterial to plain object.
let lineColor = ConstDefine.LineColor[type];
let lineMaterial = lineColor;
let lineWidth = 2;
if (type != ConstDefine.LineType.XXXX) {
lineMaterial = {
fabric: {
type: 'PolylineArrow',
uniforms: {
color: lineColor;
}
}
}
};
lineWidth = 8;
}In this way, the logic of actually instantiating the lineMaterial is placed in vue-cesium to avoid the object of the component watch being too complex (such as recursive properties) and throwing exceptions.
https://github.com/zouyaoji/vue-cesium/blob/dev/packages/utils/cesium-helpers.ts#L522
liuganting
my code:
errorHandler.js?d656:24
index.mjs:
function useDatasources(props, ctx, vcInstance) { vcInstance.cesiumEvents = ["changedEvent", "errorEvent", "loadingEvent"]; if (vcInstance.cesiumClass === "KmlDataSource") { vcInstance.cesiumEvents.push("refreshEvent"); vcInstance.cesiumEvents.push("unsupportedNodeEvent"); } vcInstance.cesiumMembersEvents = [ { name: "clock", events: ["definitionChanged"] }, { name: "clustering", events: ["clusterEvent"] }, { name: "entities", events: ["collectionChanged"] } ]; const commonState = useCommon(props, ctx, vcInstance); if (commonState === void 0) { return; } vcInstance.alreadyListening.push("entities"); let unwatchFns = []; unwatchFns.push(watch(() => cloneDeep(props.entities), (newVal, oldVal) => { if (!vcInstance.mounted) { return; } const datasource = vcInstance.cesiumObject; if (newVal.length === oldVal.length) { const modifies = []; for (let i = 0; i < newVal.length; i++) { const options = newVal[i]; const oldOptions = oldVal[i]; if (JSON.stringify(options) !== JSON.stringify(oldOptions)) { modifies.push({ newOptions: options, oldOptions }); } } modifies.forEach((v) => { const modifyEntity = datasource.entities.getById(v.oldOptions.id); if (v.oldOptions.id === v.newOptions.id) { modifyEntity && Object.keys(v.newOptions).forEach((prop) => { if (v.oldOptions[prop] !== v.newOptions[prop]) { modifyEntity[prop] = commonState.transformProp(prop, v.newOptions[prop]); } }); } else { datasource.entities.remove(modifyEntity); const entityOptions = v.newOptions; addEntities(datasource, [entityOptions]); } }); } else { const addeds = differenceBy(newVal, oldVal, "id"); const deletes = differenceBy(oldVal, newVal, "id"); const deletedEntities = []; for (let i = 0; i < deletes.length; i++) { const deleteEntity = datasource.entities.getById(deletes[i].id); deletedEntities.push(deleteEntity); } deletedEntities.forEach((v) => { datasource.entities.remove(v); }); addEntities(datasource, addeds); } }, { deep: true }));