diff --git a/src/components/Map/Map.vue b/src/components/Map/Map.vue index 2a6d65b..f94a395 100644 --- a/src/components/Map/Map.vue +++ b/src/components/Map/Map.vue @@ -534,9 +534,12 @@ }; const refreshGeoJSON = () => { - Object.keys(geojson).forEach( - (key) => map.getSource(key) && map.getSource(key).setData(geojson[key]) - ); + const cacheKeys = Object.keys(newfiberMap.map.style._sourceCaches); + Object.keys(geojson).forEach((key) => { + map.getSource(key) && map.getSource(key).setData(geojson[key]); + cacheKeys.filter(k => k.includes(key)).forEach(k => newfiberMap.map.style._sourceCaches[k].clearTiles()); + console.log('refreshGeoJSON',cacheKeys.filter(k => k.includes(key))); + }); map.triggerRepaint(); }; diff --git a/src/components/Map/Map.vue b/src/components/Map/Map.vue index 2a6d65b..f94a395 100644 --- a/src/components/Map/Map.vue +++ b/src/components/Map/Map.vue @@ -534,9 +534,12 @@ }; const refreshGeoJSON = () => { - Object.keys(geojson).forEach( - (key) => map.getSource(key) && map.getSource(key).setData(geojson[key]) - ); + const cacheKeys = Object.keys(newfiberMap.map.style._sourceCaches); + Object.keys(geojson).forEach((key) => { + map.getSource(key) && map.getSource(key).setData(geojson[key]); + cacheKeys.filter(k => k.includes(key)).forEach(k => newfiberMap.map.style._sourceCaches[k].clearTiles()); + console.log('refreshGeoJSON',cacheKeys.filter(k => k.includes(key))); + }); map.triggerRepaint(); }; diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue index 5b05425..1df1977 100644 --- a/src/components/Map/MapBox.vue +++ b/src/components/Map/MapBox.vue @@ -351,19 +351,19 @@ ({ 1: () => { !layerId && newfiberMap.map.easeTo(newfiberMap.config_.params.init); - [() => wsRouteToMapByName(properties), () => showOutletInfo(properties)][ + [() => wsRouteToMapByName([properties]), () => showOutletInfo(properties)][ Number(isYS) ](); }, 2: () => { - [() => wsRouteToMapByName(properties), () => showOutletInfo(properties)][ + [() => wsRouteToMapByName([properties]), () => showOutletInfo(properties)][ Number(isYS) ](); }, 3: () => { [ () => { - wsRouteToMapByName(properties); + wsRouteToMapByName([properties]); }, () => { const _keys_ = [ @@ -427,85 +427,7 @@ psfq.prevIds.push(properties); } - function wsRouteToMapByName(properties) { - const _keys_ = [ - "污水系统流向1", - "污水系统流向", - "1_泵站", - "1_污水处理厂", - "sewage_pipeline_quality1", - "sewage_pump_station_info1", - "storage_tank_info1", - ]; - _keys_.forEach((k) => busEmit(setLayerVisible.key, { layername: k, isCheck: true })); - busEmit(removeMapDatas.key, _keys_); - let features = _.cloneDeep( - ws_routeGeoJSON.features.filter((i) => - i.properties.bind.split(",").includes(properties.name) - ) - ); - let geojson = turf.featureCollection( - features.map((i) => - Object.assign(i, { - properties: { - ...i.properties, - name: i.properties.name, - type: i.properties._type || "污水系统流向1", - color: "rgb(255,74,25)", - width: [0, 7, 5, 3][properties.level], - }, - }) - ) - ); - newfiberMap - .getLayers() - .filter((i) => i.newfiberId == _keys_[1])[0] - .setData(geojson); - busEmit(setGeoJSON.key, { json: geojson, key: _keys_[0] }); - let [features_point, features_point1, features_point2] = [[], [], []]; - let polygon = turf.flatten(Terraformer.WKT.parse(properties.geometry)).features[0]; - if (["2", "3"].includes(properties.level)) { - let kk = _.replace(_keys_[4], /\d+/g, ""); - features_point = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => i.properties.type.includes(kk)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - features_point1 = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => _keys_[5].includes(i.properties.type)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - } - features_point2 = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => _keys_[6].includes(i.properties.type)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - let geojson1 = turf.featureCollection( - [ - ...features_point.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[4] }, - })), - ...features_point1.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[5] }, - })), - ...features_point2.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[6] }, - })), - ] - .flat() - .filter(Boolean) - ); - busEmit(setGeoJSON.key, { json: geojson1, key: _keys_[4] }); - } function showOutletInfo(properties) { const key = "outlet_info"; @@ -647,6 +569,36 @@ } }; +function wsRouteToMapByName(properties) { + const { setLayerVisible, setHighlight, setGeoJSON, removeMapDatas } = events_params; + const _keys_ = ["污水系统流向1", "污水系统流向", "1_泵站", "1_污水处理厂", "sewage_pipeline_quality1", "sewage_pump_station_info1", "storage_tank_info1"]; + _keys_.forEach((k) => busEmit(setLayerVisible.key, { layername: k, isCheck: true })); + busEmit(removeMapDatas.key, _keys_); + if(!properties) properties = newfiberMap.map.getSource("hb_wh_dhgx_psfq_geometrys")._data.features.filter(i => i.properties.p_type == 'WS1').map(i => i.properties); + let geojson = turf.featureCollection([]); + properties.forEach(p => { + let features = _.cloneDeep(ws_routeGeoJSON.features.filter((i) => i.properties.bind.split(",").includes(p.name))); + geojson.features = geojson.features.concat(features.map((i) => Object.assign(i, {properties: {...i.properties, name: i.properties.name, type: i.properties._type || "污水系统流向1", color: "rgb(255,74,25)", width: [0, 7, 5, 3][p.level]},}))); + busEmit(setGeoJSON.key, { json: geojson, key: _keys_[0] }); + }) + newfiberMap.getLayers().filter((i) => i.newfiberId == _keys_[1])[0].setData(geojson); + if(properties.length != 1) return; + let [features_point, features_point1, features_point2] = [[], [], []]; + let polygon = turf.flatten(Terraformer.WKT.parse(properties[0].geometry)).features[0]; + if (["2", "3"].includes(properties[0].level)) { + let kk = _.replace(_keys_[4], /\d+/g, ""); + features_point = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => i.properties.type.includes(kk)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + features_point1 = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => _keys_[5].includes(i.properties.type)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + } + features_point2 = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => _keys_[6].includes(i.properties.type)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + let geojson1 = turf.featureCollection([ + ...features_point.map((i) => ({...i, properties: { ...i.properties, type: _keys_[4] },})), + ...features_point1.map((i) => ({...i, properties: { ...i.properties, type: _keys_[5] },})), + ...features_point2.map((i) => ({...i, properties: { ...i.properties, type: _keys_[6] },})) + ].flat().filter(Boolean) + ); + busEmit(setGeoJSON.key, { json: geojson1, key: _keys_[4] }); +} function clearRouteMethod() { const { removeMapDatas } = events_params; const _keys = [ @@ -1172,6 +1124,7 @@ trajectoryToMap: { key: "trajectoryToMap", method: trajectoryToMap }, clearTrajectory: { key: "clearTrajectory", method: clearTrajectory }, clearTemporaryData: { key: "clearTemporaryData", method: clearTemporaryData }, + wsRouteToMapByName: { key: "wsRouteToMapByName", method: wsRouteToMapByName }, load3DTiles: { key: "load3DTiles", method: load3DTiles }, remove3Dtiles: { key: "remove3Dtiles", method: remove3Dtiles }, isOpenPanorama: { diff --git a/src/components/Map/Map.vue b/src/components/Map/Map.vue index 2a6d65b..f94a395 100644 --- a/src/components/Map/Map.vue +++ b/src/components/Map/Map.vue @@ -534,9 +534,12 @@ }; const refreshGeoJSON = () => { - Object.keys(geojson).forEach( - (key) => map.getSource(key) && map.getSource(key).setData(geojson[key]) - ); + const cacheKeys = Object.keys(newfiberMap.map.style._sourceCaches); + Object.keys(geojson).forEach((key) => { + map.getSource(key) && map.getSource(key).setData(geojson[key]); + cacheKeys.filter(k => k.includes(key)).forEach(k => newfiberMap.map.style._sourceCaches[k].clearTiles()); + console.log('refreshGeoJSON',cacheKeys.filter(k => k.includes(key))); + }); map.triggerRepaint(); }; diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue index 5b05425..1df1977 100644 --- a/src/components/Map/MapBox.vue +++ b/src/components/Map/MapBox.vue @@ -351,19 +351,19 @@ ({ 1: () => { !layerId && newfiberMap.map.easeTo(newfiberMap.config_.params.init); - [() => wsRouteToMapByName(properties), () => showOutletInfo(properties)][ + [() => wsRouteToMapByName([properties]), () => showOutletInfo(properties)][ Number(isYS) ](); }, 2: () => { - [() => wsRouteToMapByName(properties), () => showOutletInfo(properties)][ + [() => wsRouteToMapByName([properties]), () => showOutletInfo(properties)][ Number(isYS) ](); }, 3: () => { [ () => { - wsRouteToMapByName(properties); + wsRouteToMapByName([properties]); }, () => { const _keys_ = [ @@ -427,85 +427,7 @@ psfq.prevIds.push(properties); } - function wsRouteToMapByName(properties) { - const _keys_ = [ - "污水系统流向1", - "污水系统流向", - "1_泵站", - "1_污水处理厂", - "sewage_pipeline_quality1", - "sewage_pump_station_info1", - "storage_tank_info1", - ]; - _keys_.forEach((k) => busEmit(setLayerVisible.key, { layername: k, isCheck: true })); - busEmit(removeMapDatas.key, _keys_); - let features = _.cloneDeep( - ws_routeGeoJSON.features.filter((i) => - i.properties.bind.split(",").includes(properties.name) - ) - ); - let geojson = turf.featureCollection( - features.map((i) => - Object.assign(i, { - properties: { - ...i.properties, - name: i.properties.name, - type: i.properties._type || "污水系统流向1", - color: "rgb(255,74,25)", - width: [0, 7, 5, 3][properties.level], - }, - }) - ) - ); - newfiberMap - .getLayers() - .filter((i) => i.newfiberId == _keys_[1])[0] - .setData(geojson); - busEmit(setGeoJSON.key, { json: geojson, key: _keys_[0] }); - let [features_point, features_point1, features_point2] = [[], [], []]; - let polygon = turf.flatten(Terraformer.WKT.parse(properties.geometry)).features[0]; - if (["2", "3"].includes(properties.level)) { - let kk = _.replace(_keys_[4], /\d+/g, ""); - features_point = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => i.properties.type.includes(kk)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - features_point1 = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => _keys_[5].includes(i.properties.type)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - } - features_point2 = _.cloneDeep( - newfiberMap.map - .getSource("point") - ._data.features.filter((i) => _keys_[6].includes(i.properties.type)) - .filter((o) => turf.booleanPointInPolygon(o, polygon)) - ); - let geojson1 = turf.featureCollection( - [ - ...features_point.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[4] }, - })), - ...features_point1.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[5] }, - })), - ...features_point2.map((i) => ({ - ...i, - properties: { ...i.properties, type: _keys_[6] }, - })), - ] - .flat() - .filter(Boolean) - ); - busEmit(setGeoJSON.key, { json: geojson1, key: _keys_[4] }); - } function showOutletInfo(properties) { const key = "outlet_info"; @@ -647,6 +569,36 @@ } }; +function wsRouteToMapByName(properties) { + const { setLayerVisible, setHighlight, setGeoJSON, removeMapDatas } = events_params; + const _keys_ = ["污水系统流向1", "污水系统流向", "1_泵站", "1_污水处理厂", "sewage_pipeline_quality1", "sewage_pump_station_info1", "storage_tank_info1"]; + _keys_.forEach((k) => busEmit(setLayerVisible.key, { layername: k, isCheck: true })); + busEmit(removeMapDatas.key, _keys_); + if(!properties) properties = newfiberMap.map.getSource("hb_wh_dhgx_psfq_geometrys")._data.features.filter(i => i.properties.p_type == 'WS1').map(i => i.properties); + let geojson = turf.featureCollection([]); + properties.forEach(p => { + let features = _.cloneDeep(ws_routeGeoJSON.features.filter((i) => i.properties.bind.split(",").includes(p.name))); + geojson.features = geojson.features.concat(features.map((i) => Object.assign(i, {properties: {...i.properties, name: i.properties.name, type: i.properties._type || "污水系统流向1", color: "rgb(255,74,25)", width: [0, 7, 5, 3][p.level]},}))); + busEmit(setGeoJSON.key, { json: geojson, key: _keys_[0] }); + }) + newfiberMap.getLayers().filter((i) => i.newfiberId == _keys_[1])[0].setData(geojson); + if(properties.length != 1) return; + let [features_point, features_point1, features_point2] = [[], [], []]; + let polygon = turf.flatten(Terraformer.WKT.parse(properties[0].geometry)).features[0]; + if (["2", "3"].includes(properties[0].level)) { + let kk = _.replace(_keys_[4], /\d+/g, ""); + features_point = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => i.properties.type.includes(kk)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + features_point1 = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => _keys_[5].includes(i.properties.type)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + } + features_point2 = _.cloneDeep(newfiberMap.map.getSource("point")._data.features.filter((i) => _keys_[6].includes(i.properties.type)).filter((o) => turf.booleanPointInPolygon(o, polygon))); + let geojson1 = turf.featureCollection([ + ...features_point.map((i) => ({...i, properties: { ...i.properties, type: _keys_[4] },})), + ...features_point1.map((i) => ({...i, properties: { ...i.properties, type: _keys_[5] },})), + ...features_point2.map((i) => ({...i, properties: { ...i.properties, type: _keys_[6] },})) + ].flat().filter(Boolean) + ); + busEmit(setGeoJSON.key, { json: geojson1, key: _keys_[4] }); +} function clearRouteMethod() { const { removeMapDatas } = events_params; const _keys = [ @@ -1172,6 +1124,7 @@ trajectoryToMap: { key: "trajectoryToMap", method: trajectoryToMap }, clearTrajectory: { key: "clearTrajectory", method: clearTrajectory }, clearTemporaryData: { key: "clearTemporaryData", method: clearTemporaryData }, + wsRouteToMapByName: { key: "wsRouteToMapByName", method: wsRouteToMapByName }, load3DTiles: { key: "load3DTiles", method: load3DTiles }, remove3Dtiles: { key: "remove3Dtiles", method: remove3Dtiles }, isOpenPanorama: { diff --git a/src/views/pictureOnMap/index.vue b/src/views/pictureOnMap/index.vue index 9d1074a..7ddbafd 100644 --- a/src/views/pictureOnMap/index.vue +++ b/src/views/pictureOnMap/index.vue @@ -2,11 +2,7 @@
- + @@ -40,23 +36,23 @@