diff --git a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js index b476424..f4e3fbc 100644 --- a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js +++ b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js @@ -138,6 +138,8 @@ const horizontalRoundedBarChartWithBackground = function (data, id) { $(window).resize(charts.resize); } const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) { + let time = () => { + } let charts = echarts.init(id); if (!data) { data = { @@ -159,7 +161,7 @@ const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) { top: "0%", containLabel: true, }, - dataZoom:[], + dataZoom: [], xAxis: { show: false, }, @@ -213,8 +215,8 @@ const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) { color: "#fff", fontSize: 0.75 * vw }, - formatter: function (val,index,e) { - return data.yData[val.dataIndex] +'%' + formatter: function (val, index, e) { + return data.yData[val.dataIndex] + '%' } }, itemStyle: { @@ -245,7 +247,7 @@ const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) { }) let step = 1 / (data.yNameOne.length / 9) * 100 - setInterval(() => { + time = setInterval(() => { option.dataZoom[0].end += step option.dataZoom[0].start += step if (option.dataZoom[0].start >= 100) { @@ -258,6 +260,7 @@ const horizontalRoundedBarChartWithBackgroundTwo = function (data, id) { } charts.setOption(option); }, 3000) + time() } charts.setOption(option); $(window).resize(charts.resize); @@ -919,7 +922,7 @@ const barChartAndLineChartFour = function (data, id) { } ] }; - if (Math.max(...data.yDataOne) <=5){ + if (Math.max(...data.yDataOne) <= 5) { option.yAxis[0].max = 5 } @@ -1503,7 +1506,7 @@ const multipleVerticalBarChartTwo = function (data, id) { } // 单个垂直柱状图 -const singleVerticalBarChart = function (data, id,rotate=0) { +const singleVerticalBarChart = function (data, id, rotate = 0) { let charts = echarts.init(id); if (!data) { data = { @@ -1583,6 +1586,14 @@ const singleVerticalBarChart = function (data, id,rotate=0) { ), }, }, + label: { + show: true, + position: "top", + textStyle: { + color: "#fff", + fontSize: 0.75 * vw + }, + }, data: data.yData, }, ], @@ -1593,12 +1604,14 @@ const singleVerticalBarChart = function (data, id,rotate=0) { $(window).resize(charts.resize); } const singleVerticalBarChartTwo = function (data, id) { + let time = () => { + } let charts = echarts.init(id); if (!data) { data = { xName: ['0时', '2时', '4时', '6时', '8时', '10时', '12时', '14时'], yData: [38, 60, 40, 55, 42, 39, 45, 40], - yImg: ['','','','','','','',''], + yImg: ['', '', '', '', '', '', '', ''], } } let option = { @@ -1620,7 +1633,7 @@ const singleVerticalBarChartTwo = function (data, id) { color: '#c0c3cd', //X轴文字 fontSize: 14, interval: 0, - rotate:20, + rotate: 20, }, axisTick: { lineStyle: { @@ -1709,8 +1722,8 @@ const singleVerticalBarChartTwo = function (data, id) { { type: 'pictorialBar', name: 'pictorial element', - symbol: function(val,index){ - return 'image://' + 'http://10.100.70.5:9090/' + data.yImg[index.dataIndex] + symbol: function (val, index) { + return 'image://' + 'http://10.100.70.5:9090/' + data.yImg[index.dataIndex] }, symbolSize: [40, 40], z: 10, @@ -1722,7 +1735,7 @@ const singleVerticalBarChartTwo = function (data, id) { } }) }, - ], + ], }; if (data.xName.length > 10) { option.dataZoom.push({ @@ -1739,20 +1752,21 @@ const singleVerticalBarChartTwo = function (data, id) { } }) - let step = 1 / (data.xName.length / 11) * 100 - setInterval(() => { - option.dataZoom[0].end += step - option.dataZoom[0].start += step - if (option.dataZoom[0].start >= 100) { - option.dataZoom[0].start = 0 - option.dataZoom[0].end = step - } - if (option.dataZoom[0].end >= 100) { - option.dataZoom[0].end = 100 - option.dataZoom[0].start = option.dataZoom[0].end - step - } - charts.setOption(option); - }, 3000) + let step = 1 / (data.xName.length / 11) * 100 + time = setInterval(() => { + option.dataZoom[0].end += step + option.dataZoom[0].start += step + if (option.dataZoom[0].start >= 100) { + option.dataZoom[0].start = 0 + option.dataZoom[0].end = step + } + if (option.dataZoom[0].end >= 100) { + option.dataZoom[0].end = 100 + option.dataZoom[0].start = option.dataZoom[0].end - step + } + charts.setOption(option); + }, 3000) + time() } @@ -2124,28 +2138,28 @@ const hollowPieChart = function (data, id) { // 多个环形图 const percentageRingDiagram = function (data, id) { let charts = echarts.init(id); - data ??= [ - { - name: "内胆检漏", - value: 54, - }, - { - name: "安全检测", - value: 44, - }, - { - name: "成品检漏", - value: 35, - }, - { - name: "测温性能", - value: 30, - }, - { - name: "成品外观", - value: 44, - }, - ]; + data ??= [ + { + name: "内胆检漏", + value: 54, + }, + { + name: "安全检测", + value: 44, + }, + { + name: "成品检漏", + value: 35, + }, + { + name: "测温性能", + value: 30, + }, + { + name: "成品外观", + value: 44, + }, + ]; let titleArr = [], seriesArr = []; @@ -2194,7 +2208,7 @@ const percentageRingDiagram = function (data, id) { }, hoverAnimation: false, center: [ - index > 2 ? (index - 3) * 25 + 30 + "%" : index * 25 + 20 + "%", + index > 2 ? (index - 3) * 25 + 30 + "%" : index * 25 + 20 + "%", index > 2 ? "75%" : "25%", ], data: [