diff --git a/src/views/oneMap/FloodStuationReview/sqhgBottomBox.vue b/src/views/oneMap/FloodStuationReview/sqhgBottomBox.vue index 44528b3..53d38bb 100644 --- a/src/views/oneMap/FloodStuationReview/sqhgBottomBox.vue +++ b/src/views/oneMap/FloodStuationReview/sqhgBottomBox.vue @@ -209,10 +209,12 @@ runTime = 3000; // showRainFlow.value = true; } + runDayInterval.value = setTimeout(() => { stepNum.value++; if (stepNum.value <= 24) { - initRainImage([images[stepNum.value]]); + + setRainImage(stepNum.value - 1); // NewFiberMapUtils.disposeRainfall(hoursList.value.rainTrend[Number(stepNum.value)-1]) stepLin.value = `${stepNum.value * 4.1666}%`; let levels = ranLeng[0].map((i, idx) => ({ ...i, value: Number(i.value.split('-')[0]) })); @@ -352,7 +354,7 @@ const plotInit = (colorScale = colorScale) => { const minVal = colorScale[0].value; - const maxVal = colorScale[colorScale.length - 1].value; + const maxVal = 250 || colorScale[colorScale.length - 1].value; let color = colorScale.filter(i => Number(i.value) / maxVal <= 1); if (color[color.length - 1].value / maxVal < 1) color.push({ value: maxVal, color: colorScale[color.length].color }); plotty.addColorScale( @@ -362,7 +364,7 @@ ); }; -let colorScale = [ +/*let colorScale = [ { value: '0', color: 'rgba(7, 213, 118, 0)' }, { value: '0.1', color: 'rgba(7, 213, 118, 0)' }, { value: '5', color: 'rgba(7, 213, 118, 1)' }, @@ -370,17 +372,25 @@ { value: '30', color: 'rgba(247, 223, 56, 1)' }, { value: '70', color: 'rgba(230, 85, 41, 1)' }, { value: '140', color: 'rgba(255, 26, 26, 1)' }, +];*/ +let colorScale = [ + { value: '0', color: 'rgba(7, 213, 118, 0)' }, + { value: '0.2', color: 'rgba(7, 213, 118, 1)' }, + { value: '5', color: 'rgba(38, 129, 240,1)' }, + { value: '25', color: 'rgba(255, 26, 26, 1)' }, + { value: '250', color: 'rgba(255, 26, 26, 1)' }, ]; let imageFiles = []; let canvas = []; let plot = null; const initRainImage = async imagesList => { + console.log('imagesList',imagesList); imageFiles = await Promise.all(imagesList.map(url => urlToFile(url, _.last(_.split(url, '/'))))); canvas = createCanvas(0); plotInit(colorScale); createCanvasLayer(canvas.id, 0, [109.36903069276376, 36.53005543707354, 109.62694602722712, 36.7105574823517]); - setRainImage(0); + // setRainImage(0); // let i = 0; // let interval = setInterval(() => { // if (i >= imageFiles.length) i = 0; @@ -389,10 +399,13 @@ }; const setRainImage = index => { + var reader = new FileReader(); reader.onload = e => createPlot(e, canvas); reader.readAsArrayBuffer(imageFiles[index]); }; +initRainImage(images); + watch( () => props.checkTime, val => {