diff --git a/src/views/screen/Dashboard.vue b/src/views/screen/Dashboard.vue
index bb36a87..8ccf9d6 100644
--- a/src/views/screen/Dashboard.vue
+++ b/src/views/screen/Dashboard.vue
@@ -136,7 +136,7 @@
@@ -619,16 +619,16 @@ function updateChartCounty() {
if (!chartCounty) return;
const names = countyList.value.map(i => i.raw?.view028 ?? '未知');
- const values = countyList.value.map(i => (i.raw?.view035 ? Number(i.raw.view035) : 0));
+ const values1 = countyList.value.map(i => (i.raw?.view035 ? Number(i.raw.view035) : 0));
const values2 = countyList.value.map(i => (i.raw?.view036 ? Number(i.raw.view036) : 0));
- const maxVal = values.length ? Math.max(...values, ...values2) * 1.15 : 100;
+ const maxVal = values1.length ? Math.max(...values1) : 100;
chartCounty.setOption({
grid: {
left: 10,
right: 120, // 增加右侧空间以容纳两个标签
- bottom: 14,
- top: 28,
+ bottom: 8,
+ top: 18,
containLabel: true
},
tooltip: {
@@ -664,8 +664,8 @@ function updateChartCounty() {
axisLabel: {
color: jbztys.value,
interval: 0,
- fontSize: 16, // 稍微减小字体以适应更多内容
- margin: 2 // 减少边距
+ fontSize: 12, // 稍微减小字体以适应更多内容
+ margin: 0 // 减少边距
},
axisTick: { show: false },
axisLine: { show: false }
@@ -691,9 +691,9 @@ function updateChartCounty() {
// 第一个主体条(供水温度)- 左侧柱子
{
type: 'bar',
- barWidth: 10, // 减小宽度
- barGap: '60%', // 设置柱子间距
- data: values.map((val, index) => ({
+ barWidth: 8, // 减小宽度
+ barGap: '30%', // 设置柱子间距
+ data: values1.map((val, index) => ({
value: val,
itemStyle: {
color: {
@@ -712,8 +712,8 @@ function updateChartCounty() {
// 第二个主体条(回水温度)- 右侧柱子
{
type: 'bar',
- barWidth: 10, // 减小宽度
- barGap: '60%', // 设置柱子间距
+ barWidth: 8, // 减小宽度
+ barGap: '30%', // 设置柱子间距
data: values2.map((val, index) => ({
value: val,
itemStyle: {
@@ -730,14 +730,14 @@ function updateChartCounty() {
z: 3
},
- // 第一个顶部小图片(供水温度)
+ // // 第一个顶部小图片(供水温度)
{
type: 'pictorialBar',
symbol: `image://${lqImg}`,
symbolSize: [25, 25], // 减小图标大小
- symbolOffset: [13, -7], // 向左偏移,放在左侧柱子顶部
+ symbolOffset: [11, -4], // 向左偏移,放在左侧柱子顶部
symbolPosition: 'end',
- data: values,
+ data: values1,
z: 4,
silent: true
},
@@ -747,7 +747,7 @@ function updateChartCounty() {
type: 'pictorialBar',
symbol: `image://${lqImg}`,
symbolSize: [25, 25], // 减小图标大小
- symbolOffset: [13, 9], // 向右偏移,放在右侧柱子顶部
+ symbolOffset: [13, 6], // 向右偏移,放在右侧柱子顶部
symbolPosition: 'end',
data: values2,
z: 5,
@@ -758,20 +758,23 @@ function updateChartCounty() {
{
type: 'bar',
barWidth: 8,
- data: values.map(() => maxVal),
+ data: values1.map(() => maxVal.toFixed(1)),
itemStyle: { color: 'transparent' },
label: {
show: true,
position: 'right',
distance: 40,
- fontSize: 18, // 减小字体大小
+ fontSize: 16, // 减小字体大小
offset: [-20, -20], // 添加偏移量
align: 'left',
color: '#ffffff',
formatter: (params) => {
- const value = values[params.dataIndex];
+ console.log("🚀 ~ updateChartCounty ~ params:", params)
+ const value1 = values1[params.dataIndex];
+ console.log("🚀 ~ updateChartCounty ~ value1:", value1)
const value2 = values2[params.dataIndex];
- return `{icon|} ${value.toFixed(1)} - ${value2.toFixed(2)}`; // 格式化数值
+ console.log("🚀 ~ updateChartCounty ~ value2:", value2)
+ return `{icon|} ${value1.toFixed(1)} - ${value2.toFixed(1)}`; // 格式化数值
},
rich: {
icon: {
@@ -784,55 +787,16 @@ function updateChartCounty() {
}
}
},
- z: 7,
+ z: 6,
silent: true
},
- // 第二个标签(回水温度)- 右侧标签
- // {
- // type: 'bar',
- // barWidth: 8,
- // data: values2.map(() => maxVal),
- // itemStyle: { color: 'transparent' },
- // label: {
- // show: true,
- // position: 'right',
- // distance: 40, // 增加距离,放在更右侧
- // fontSize: 12, // 减小字体大小
- // offset: [0, -20], // 添加偏移量
- // align: 'left',
- // color: '#ffffff',
- // formatter: (params) => {
- // const value = values2[params.dataIndex];
- // return `{icon2|} ${value.toFixed(1)}`; // 格式化数值
- // },
- // rich: {
- // icon2: {
- // width: 12,
- // height: 12,
- // align: 'center',
- // backgroundColor: {
- // image: ljt
- // }
- // }
- // }
- // },
- // z: 7,
- // silent: true
- // }
],
}, true);
// 添加点击事件
chartCounty.off('click');
chartCounty.on('click', function(params) {
- if (params.seriesIndex === 1 || params.seriesIndex === 2) {
- const clickedName = params.name;
- const gsValue = values[params.dataIndex];
- const hsValue = values2[params.dataIndex];
-
- // 这里可以添加你的业务逻辑
- }
});
}
// area-7 的雷达图更新函数