diff --git a/src/views/floodSys/floodYP/riskAsses.vue b/src/views/floodSys/floodYP/riskAsses.vue index e3313ec..234cd72 100644 --- a/src/views/floodSys/floodYP/riskAsses.vue +++ b/src/views/floodSys/floodYP/riskAsses.vue @@ -117,18 +117,18 @@ }); const isdisabled = ref(false); //根据步长更换颜色 -const changeFeatureColor = step => { - features.value.forEach(feature => { - let lineColor = feature.extData[step] < 1 ? '#47E44E' : '#DD3737'; - feature.setColor(lineColor); - }); -}; -const getTimeLineIndex = index => { - if (!(index % 100 == 0)) return; - featureStep.value = index / 100; - paramsCase.value.featureStep = featureStep.value; - newfiberMapbox.map.ogcLayers.filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0].next(980); -}; +// const changeFeatureColor = step => { +// features.value.forEach(feature => { +// let lineColor = feature.extData[step] < 1 ? '#47E44E' : '#DD3737'; +// feature.setColor(lineColor); +// }); +// }; +// const getTimeLineIndex = index => { +// if (!(index % 100 == 0)) return; +// featureStep.value = index / 100; +// paramsCase.value.featureStep = featureStep.value; +// newfiberMap_risk.map.ogcLayers.filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0].next(980); +// }; //内涝风险评估 地图内涝渲染模拟 const gisModuleData = () => { moduleGeometryData(gisParams.value).then(res => { @@ -141,7 +141,7 @@ id: idx, name: `${(((idx + 1) * 5) / 60).toFixed(0).padStart(2, 0)}:${((((idx + 1) * 5) % 60) + '').padStart(2, 0)}`, })); - newfiberMapbox.map.ogcLayers + newfiberMap_risk.map.ogcLayers .filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0] .setInitializeParams({ images: gisJsonData.value.map(i => i.url).reverse(), @@ -151,13 +151,13 @@ }); if (!!gisJsonData.value.length && gisJsonData.value.length > 1) { isdisabled.value = false; - !!newfiberMapbox.map.getLayer('riskAssesImage') && newfiberMapbox.map.removeLayer('riskAssesImage'); - !!newfiberMapbox.map.getSource('riskAssesImage') && newfiberMapbox.map.removeSource('riskAssesImage'); + !!newfiberMap_risk.map.getLayer('riskAssesImage') && newfiberMap_risk.map.removeLayer('riskAssesImage'); + !!newfiberMap_risk.map.getSource('riskAssesImage') && newfiberMap_risk.map.removeSource('riskAssesImage'); addImageLayer(minPoint, maxPoint); } else { isdisabled.value = true; - !!newfiberMapbox.map.getLayer('riskAssesImage') && newfiberMapbox.map.removeLayer('riskAssesImage'); - !!newfiberMapbox.map.getSource('riskAssesImage') && newfiberMapbox.map.removeSource('riskAssesImage'); + !!newfiberMap_risk.map.getLayer('riskAssesImage') && newfiberMap_risk.map.removeLayer('riskAssesImage'); + !!newfiberMap_risk.map.getSource('riskAssesImage') && newfiberMap_risk.map.removeSource('riskAssesImage'); } }); }; @@ -165,7 +165,7 @@ const addImageLayer = (minPoint, maxPoint) => { let coordinates; - newfiberMapbox.map.addSource('riskAssesImage', { + newfiberMap_risk.map.addSource('riskAssesImage', { type: 'image', url: gisJsonData.value[gisJsonData.value.length - 1].url, coordinates: [ @@ -175,7 +175,7 @@ [Number(minPoint[0]), Number(minPoint[1])], ], }); - newfiberMapbox.map.addLayer({ + newfiberMap_risk.map.addLayer({ id: 'riskAssesImage', type: 'raster', source: 'riskAssesImage', @@ -270,7 +270,7 @@ timer.value = setInterval(() => { console.log('timer------'); featureStep.value += 1; - newfiberMapbox.map + newfiberMap_risk.map .getSource('riskAssesImage') .updateImage({ url: gisJsonData.value[gisJsonData.value.length - 1 - featureStep.value].url }); @@ -289,7 +289,7 @@ processVal.value = 100; stopImitate(); } - changeFeatureColor(setp_play); + //changeFeatureColor(setp_play); }, 1000 / searchValSpeed.value); } else { timer.value = setInterval(() => { @@ -304,7 +304,7 @@ const mapInit = () => { getZSList(); // addCityBoundary(); - // newfiberMapbox.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); + // newfiberMap_risk.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); }; // 暂停模拟 function stopImitate() { @@ -319,10 +319,10 @@ } //添加孝感城区边界 const addCityBoundary = () => { - !newfiberMapbox.map.getSource('xiaoganCityBoundary') && - newfiberMapbox.map.addSource('xiaoganCityBoundary', { type: 'geojson', data: xiaoganCityBoundary }); - !newfiberMapbox.map.getLayer('xiaoganCityBoundary') && - !newfiberMapbox.map.addLayer({ + !newfiberMap_risk.map.getSource('xiaoganCityBoundary') && + newfiberMap_risk.map.addSource('xiaoganCityBoundary', { type: 'geojson', data: xiaoganCityBoundary }); + !newfiberMap_risk.map.getLayer('xiaoganCityBoundary') && + !newfiberMap_risk.map.addLayer({ id: 'xiaoganCityBoundary', type: 'line', source: 'xiaoganCityBoundary', @@ -332,12 +332,12 @@ }, }); // setTimeout(() => { - // newfiberMapbox.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); + // newfiberMap_risk.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); // }, 3000); }; onMounted(() => { // timer.value = setInterval(() => { - // if (!!!newfiberMapbox) { + // if (!!!newfiberMap_risk) { // return; // } else { // addCityBoundary(); diff --git a/src/views/floodSys/floodYP/riskAsses.vue b/src/views/floodSys/floodYP/riskAsses.vue index e3313ec..234cd72 100644 --- a/src/views/floodSys/floodYP/riskAsses.vue +++ b/src/views/floodSys/floodYP/riskAsses.vue @@ -117,18 +117,18 @@ }); const isdisabled = ref(false); //根据步长更换颜色 -const changeFeatureColor = step => { - features.value.forEach(feature => { - let lineColor = feature.extData[step] < 1 ? '#47E44E' : '#DD3737'; - feature.setColor(lineColor); - }); -}; -const getTimeLineIndex = index => { - if (!(index % 100 == 0)) return; - featureStep.value = index / 100; - paramsCase.value.featureStep = featureStep.value; - newfiberMapbox.map.ogcLayers.filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0].next(980); -}; +// const changeFeatureColor = step => { +// features.value.forEach(feature => { +// let lineColor = feature.extData[step] < 1 ? '#47E44E' : '#DD3737'; +// feature.setColor(lineColor); +// }); +// }; +// const getTimeLineIndex = index => { +// if (!(index % 100 == 0)) return; +// featureStep.value = index / 100; +// paramsCase.value.featureStep = featureStep.value; +// newfiberMap_risk.map.ogcLayers.filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0].next(980); +// }; //内涝风险评估 地图内涝渲染模拟 const gisModuleData = () => { moduleGeometryData(gisParams.value).then(res => { @@ -141,7 +141,7 @@ id: idx, name: `${(((idx + 1) * 5) / 60).toFixed(0).padStart(2, 0)}:${((((idx + 1) * 5) % 60) + '').padStart(2, 0)}`, })); - newfiberMapbox.map.ogcLayers + newfiberMap_risk.map.ogcLayers .filter(i => i.newfiberId == 'newfiber-CanvasLayer')[0] .setInitializeParams({ images: gisJsonData.value.map(i => i.url).reverse(), @@ -151,13 +151,13 @@ }); if (!!gisJsonData.value.length && gisJsonData.value.length > 1) { isdisabled.value = false; - !!newfiberMapbox.map.getLayer('riskAssesImage') && newfiberMapbox.map.removeLayer('riskAssesImage'); - !!newfiberMapbox.map.getSource('riskAssesImage') && newfiberMapbox.map.removeSource('riskAssesImage'); + !!newfiberMap_risk.map.getLayer('riskAssesImage') && newfiberMap_risk.map.removeLayer('riskAssesImage'); + !!newfiberMap_risk.map.getSource('riskAssesImage') && newfiberMap_risk.map.removeSource('riskAssesImage'); addImageLayer(minPoint, maxPoint); } else { isdisabled.value = true; - !!newfiberMapbox.map.getLayer('riskAssesImage') && newfiberMapbox.map.removeLayer('riskAssesImage'); - !!newfiberMapbox.map.getSource('riskAssesImage') && newfiberMapbox.map.removeSource('riskAssesImage'); + !!newfiberMap_risk.map.getLayer('riskAssesImage') && newfiberMap_risk.map.removeLayer('riskAssesImage'); + !!newfiberMap_risk.map.getSource('riskAssesImage') && newfiberMap_risk.map.removeSource('riskAssesImage'); } }); }; @@ -165,7 +165,7 @@ const addImageLayer = (minPoint, maxPoint) => { let coordinates; - newfiberMapbox.map.addSource('riskAssesImage', { + newfiberMap_risk.map.addSource('riskAssesImage', { type: 'image', url: gisJsonData.value[gisJsonData.value.length - 1].url, coordinates: [ @@ -175,7 +175,7 @@ [Number(minPoint[0]), Number(minPoint[1])], ], }); - newfiberMapbox.map.addLayer({ + newfiberMap_risk.map.addLayer({ id: 'riskAssesImage', type: 'raster', source: 'riskAssesImage', @@ -270,7 +270,7 @@ timer.value = setInterval(() => { console.log('timer------'); featureStep.value += 1; - newfiberMapbox.map + newfiberMap_risk.map .getSource('riskAssesImage') .updateImage({ url: gisJsonData.value[gisJsonData.value.length - 1 - featureStep.value].url }); @@ -289,7 +289,7 @@ processVal.value = 100; stopImitate(); } - changeFeatureColor(setp_play); + //changeFeatureColor(setp_play); }, 1000 / searchValSpeed.value); } else { timer.value = setInterval(() => { @@ -304,7 +304,7 @@ const mapInit = () => { getZSList(); // addCityBoundary(); - // newfiberMapbox.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); + // newfiberMap_risk.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); }; // 暂停模拟 function stopImitate() { @@ -319,10 +319,10 @@ } //添加孝感城区边界 const addCityBoundary = () => { - !newfiberMapbox.map.getSource('xiaoganCityBoundary') && - newfiberMapbox.map.addSource('xiaoganCityBoundary', { type: 'geojson', data: xiaoganCityBoundary }); - !newfiberMapbox.map.getLayer('xiaoganCityBoundary') && - !newfiberMapbox.map.addLayer({ + !newfiberMap_risk.map.getSource('xiaoganCityBoundary') && + newfiberMap_risk.map.addSource('xiaoganCityBoundary', { type: 'geojson', data: xiaoganCityBoundary }); + !newfiberMap_risk.map.getLayer('xiaoganCityBoundary') && + !newfiberMap_risk.map.addLayer({ id: 'xiaoganCityBoundary', type: 'line', source: 'xiaoganCityBoundary', @@ -332,12 +332,12 @@ }, }); // setTimeout(() => { - // newfiberMapbox.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); + // newfiberMap_risk.map.moveLayer('xiaoganWater', 'xiaoganCityBoundary'); // }, 3000); }; onMounted(() => { // timer.value = setInterval(() => { - // if (!!!newfiberMapbox) { + // if (!!!newfiberMap_risk) { // return; // } else { // addCityBoundary(); diff --git a/vite.config.js b/vite.config.js index ea36ec6..24dcf41 100644 --- a/vite.config.js +++ b/vite.config.js @@ -7,8 +7,8 @@ const Timestamp = new Date().getTime(); //随机时间戳 // const targetUrl = 'http://192.168.16.254:7200'; //孙逢时 -// const targetUrl = 'http://192.168.20.52:7300'; //杨辉 -const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上 +const targetUrl = 'http://192.168.20.52:7300'; //杨辉 +// const targetUrl = 'https://server2.wh-nf.cn:8082/prod-api'; //线上 // https://vitejs.dev/config/ export default defineConfig(({ mode, command }) => {