2022-12-16 update

1. 调整rateAnalysis chart组件. 调整极坐标line 为 radar玫瑰图

src/pages/dataAnalysis/rateAnalysis/components/chart.vue

@@ -37,12 +37,36 @@ const props = defineProps({
 	isDiaAlone: {
 		type: Boolean,
 		default: false
+	},
+	// 是否含雷达图
+	isRadar: {
+		type: Boolean,
+		default: false
 	}
 })
 
 /**定义option */
 const option = computed({
 	get() {
+		let radar = null
+		if(props.isRadar && props.xAxis?.data?.length){
+			radar = {
+				radius: '70%',
+				center: ['60%','50%'],
+				indicator: props.xAxis.data.map(o => {
+					return {
+						text: '',
+						max: 1000
+					}
+				}),
+				splitArea: {
+					show: false
+				},
+				splitLine: {
+					show: false
+				}
+			}
+		}
 		return {
 			title: {
 				text: props.title || '',
@@ -56,9 +80,10 @@ const option = computed({
 				radius: '70%',
 				center: ['60%','50%']
 			},
+			radar: radar,
 			tooltip: {
 				formatter: (params) => {
-					return params.componentSubType==='line'? `${params.marker}${params.seriesName}频次：${params.value}` : `${params.marker}${params.seriesName}m<br/>${params.value>1? '频次：'+ params.value: ''}`
+					return params.componentSubType==='radar'? `${params.marker}${params.seriesName}` : `${params.marker}${params.seriesName}m<br/>${params.value>1? '频次：'+ params.value: ''}`
 				},
 				confine: true
 			},

src/pages/dataAnalysis/rateAnalysis/index.vue

@@ -173,6 +173,7 @@ const funSubmit = async () => {
 							show: true
 						},
 					},
+					isRadar: false,
 					series: chart.roses?.length ?chart.roses.map((o, index) => {
 						return {
 							type: 'bar',
@@ -191,22 +192,19 @@ const funSubmit = async () => {
 					id: chartId,
 					title: '',
 					subtext: '风速风向频次玫瑰图',
+					isRadar: true,
 					xAxis: {
 						type: 'category',
 						boundaryGap: false,
-						data: ['N','','','', 'N-E','','','', 'E','','','', 'S-E','','','', 'S','','','', 'S-W','','','', 'W','','','', 'W-N','','',''],
+						data: ['N','', 'N-E','', 'E','', 'S-E','', 'S','', 'S-W','', 'W','', 'W-N',''],
 						splitLine: {
 							show: true
 						}
 					},
 					series: chart.count?.length? [...chart.count.map((o,index) => {
-								const dataArr = new Array(32).fill(0)
-								for(let i=0;i<o.length;i++){
-									dataArr[i*2] = o[i]
-								}
 								return {
 									type: 'bar',
-									data: dataArr,
+									data: o,
 									coordinateSystem: 'polar',
 									name: funText(index),
 									stack: 'a',
@@ -215,14 +213,17 @@ const funSubmit = async () => {
 									}
 								}
 							}), {
-								type: 'line',
-								coordinateSystem: 'polar',
+								type: 'radar',
+								// coordinateSystem: 'polar',
 								tooltip: {
-									trigger: 'item'
+									trigger: 'item',
 								},
+								// smooth: true,
 								// areaStyle: {},
 								name: '对风',
-								data: chart.radar
+								data: [{
+									value: chart.radar,
+								}],
 							}]: []
 				})
 				chartId++
@@ -356,7 +357,7 @@ const funChartSelect = async (batch) => {
 const scatterxData = ref([
 	{
 		type: 'category',
-		data:  new Array(31).fill(-15).map((o,index) => Number((o + index))),
+		data:  new Array(61).fill(-30).map((o,index) => Number((o + index))),
 		boundaryGap: false,
 		splitLine: {
 			show: true
@@ -504,6 +505,7 @@ const funDiaSubmit = async () => {
 									show: true
 								},
 							},
+							isRadar: false,
 							series: chart.roses?.length ?chart.roses.map((o, index) => {
 								return {
 									type: 'bar',
@@ -529,19 +531,16 @@ const funDiaSubmit = async () => {
 							xAxis: {
 								type: 'category',
 								boundaryGap: false,
-								data: ['N','','','', 'N-E','','','', 'E','','','', 'S-E','','','', 'S','','','', 'S-W','','','', 'W','','','', 'W-N','','',''],
+								data: ['N','', 'N-E','', 'E','', 'S-E','', 'S','', 'S-W','', 'W','', 'W-N',''],
 								splitLine: {
 									show: true
 								}
 							},
+							isRadar: true,
 							series: chart.count?.length? [...chart.count.map((o,index) => {
-									const dataArr = new Array(32).fill(0)
-									for(let i=0;i<o.length;i++){
-										dataArr[i*2] = o[i]
-									}
 									return {
 										type: 'bar',
-										data: dataArr,
+										data: o,
 										coordinateSystem: 'polar',
 										name: funText(index),
 										stack: 'a',
@@ -550,14 +549,17 @@ const funDiaSubmit = async () => {
 										}
 									}
 								}), {
-								type: 'line',
-								coordinateSystem: 'polar',
+								type: 'radar',
+								// coordinateSystem: 'polar',
 								tooltip: {
 									trigger: 'item'
 								},
+								// smooth: true,
 								// areaStyle: {},
 								name: '对风',
-								data: chart.radar
+								data: [{
+									value: chart.radar,
+								}],
 							}]: []
 						})
 						chartId++
@@ -576,6 +578,7 @@ const funDiaSubmit = async () => {
 									return [o.x+'', o.y]
 								})
 							}],
+							isRadar: false,
 							series: [{
 								name: "对风频次",
 								type: "line",
@@ -615,6 +618,7 @@ const funDiaSubmit = async () => {
 							subtext: '静态偏航对风分析图',
 							xAxis: scatterxData.value,
 							yAxis: scatteryData.value,
+							isRadar: false,
 							series: [
 								{
 									name: '对风偏航',
@@ -714,7 +718,7 @@ onActivated(() => {
 			<div v-loading="exportLoading">
 				<div ref="diaPanelRef" class="flex flex-wrap justify-center items-center h-[650px] overflow-y-auto overflow-x-hidden">
 					<component :is="item.actCop" :width="actCopList.length > 1 ? '50%' : '100%'" height="100%" v-for="item in actCopList"
-						:key="item.id" :xAxis="item.xAxis" :subtext="item.subtext" :title="item.title"
+						:key="item.id" :xAxis="item.xAxis" :subtext="item.subtext" :isRadar="item.isRadar" :title="item.title"
 						:series="item.series" :isDiaAlone="(actCopList.length === 1)" @dblclick="funDbClick(item)" :yAxis="item.yAxis" :dataset="item.dataset" :brush="item.isBrush" @getSelected="funChartSelect"></component>
 				</div>
 			</div>
@@ -740,7 +744,7 @@ onActivated(() => {
 								@click="funActCop(item, 'chartCop' + (index + 1))">
 								<ZoomIn />
 							</el-icon>
-							<chart-cop class="" height="100%" width="100%" :xAxis="item.xAxis" :subtext="item.subtext"
+							<chart-cop class="" height="100%" width="100%" :xAxis="item.xAxis" :isRadar="item.isRadar" :subtext="item.subtext"
 								:title="item.title" :series="item.series">
 							</chart-cop>
 						</div>

src/pages/dataAnalysis/rateAnalysis/rateAnalysis.json

@@ -34,7 +34,7 @@
 					"borderWidth": "2"
 			},
 			"lineStyle": {
-					"width": "3"
+					"width": "2"
 			},
 			"symbolSize": "8",
 			"symbol": "emptyCircle",