zhouhui
/
lcny-vue3-antd-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改大屏

new-map
ihzero 2022-11-16 14:48:30 +08:00
parent db4c346bdf
commit 0ce97527b7
4 changed files with 195 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
src/views/visualization/components/DXCY.vue
View File

@ -45,17 +45,21 @@
const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>)
async function getData() {
async function getData(init = true) {
const resData = await getRiceShrimpIndustry({
year: visualizationStore.getYear,
})
Data.x_axis = resData.x_axis
Data.series = resData.series
chartsInit()
if (init) {
chartsInit()
} else {
chartLineAmi()
}
}
let legendData = [] as any
const chartsInit = () => {
function formatChartData() {
const obj = {
legendData: [] as any,
series: [] as any,
@ -63,12 +67,12 @@
Data.series.forEach(({ name, data }, index) => {
const color = chartLineColors[index % chartLineColors.length]
obj.legendData.push(name)
obj.legendData.push(name + '')
obj.series.push({
name: name,
data: data,
smooth: false,
type: 'line',
smooth: false,
// symbol: 'none',
itemStyle: {
color: color.itemColor,
@ -78,8 +82,11 @@
},
})
})
legendData = obj.legendData
return obj
}
const chartsInit = () => {
const obj = formatChartData()
setOptions({
grid: { left: '2%', right: '4%', top: '10%', bottom: '2%', containLabel: true },
@ -142,35 +149,40 @@
function chartAmi() {
let index = 0
const timerNumber = 3000
let sleep = 1
timer && clearInterval(timer)
let currentIndex = 0
let sleep = 0
const fo = 2
timer = setInterval(() => {
const currentIndex = index % 4
sleep = index % (4 * 2)
currentIndex = index % 4
sleep = index % (4 * fo)
getInstance()?.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: currentIndex,
})
if (sleep == 7) {
chartLineAmi()
if (sleep + 1 >= 4 * fo) {
timer && clearInterval(timer)
setTimeout(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
}, timerNumber)
getData(false)
}
index++
}, timerNumber)
}
function chartLineAmi() {
const obj = formatChartData()
let index = 0
let currentIndex = 0
const timerNumber = 3000
timer && clearInterval(timer)
let legendIndex = legendData.length
let sleep = 6000 / 3000
timer = setInterval(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
if (legendIndex == legendData.length) {
currentIndex = index % legendData.length
if (currentIndex == 0) {
legendData.forEach((_, index) => {
getInstance()?.dispatchAction({
type: 'legendUnSelect',
@ -178,17 +190,21 @@
})
})
}
if (legendIndex >= 0) {
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[legendIndex - 1],
})
getInstance()?.setOption({
series: [obj.series[currentIndex]],
})
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[currentIndex],
})
if (currentIndex == legendData.length - 1) {
timer && clearInterval(timer)
setTimeout(() => {
chartAmi()
}, timerNumber)
}
if (legendIndex <= 0) {
if (sleep <= 0) getData()
sleep--
}
legendIndex--
index++
}, timerNumber)
}

94
src/views/visualization/components/DXJG.vue
View File

@ -51,14 +51,15 @@
chartsInit()
}
const reducer = (acc, cur) => (cur > acc ? cur : acc)
function largestOfFour(arr) {
return arr.map(({ data }) => data.reduce(reducer))
}
// const reducer = (acc, cur) => (cur > acc ? cur : acc)
// function largestOfFour(arr) {
// return arr.map(({ data }) => data.reduce(reducer))
// }
const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>)
let legendData = [] as any
const chartsInit = () => {
function formatChartData() {
const obj = {
legendData: [] as any,
series: [] as any,
@ -81,10 +82,13 @@
},
})
})
const max = Math.max(...largestOfFour(Data.series)) ?? 100
legendData = obj.legendData
return obj
}
const chartsInit = () => {
const obj = formatChartData()
// const max = Math.max(...largestOfFour(Data.series)) ?? 100
setOptions({
grid: { left: '4%', right: '4%', top: '10%', bottom: '2%', containLabel: true },
@ -152,29 +156,42 @@
let timer: any = null
function chartAmi() {
let index = 1
let index = 0
const timerNumber = 3000
timer && clearInterval(timer)
let sleep = 1
let type = 'showTip'
let legendIndex = legendData.length
let currentIndex = 0
let sleep = 0
const fo = 2
timer = setInterval(() => {
if (legendData.length == 0) return
const currentIndex = (index - 1) % 4
sleep = index % (4 * 2)
currentIndex = index % 4
sleep = index % (4 * fo)
getInstance()?.dispatchAction({
type: type,
type: 'showTip',
seriesIndex: 0,
dataIndex: currentIndex,
})
// console.log('currentIndex', currentIndex)
// console.log('legendIndex', legendIndex)
// console.log('sleep', sleep)
// console.log('index', index)
if (sleep + 1 >= 4 * fo) {
timer && clearInterval(timer)
setTimeout(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
}, timerNumber)
getData(false)
}
index++
}, timerNumber)
}
if (type == 'hideTip' && currentIndex == 0) {
function chartLineAmi() {
const obj = formatChartData()
let index = 0
let currentIndex = 0
const timerNumber = 3000
timer && clearInterval(timer)
timer = setInterval(() => {
currentIndex = index % legendData.length
if (currentIndex == 0) {
legendData.forEach((_, index) => {
getInstance()?.dispatchAction({
type: 'legendUnSelect',
@ -182,28 +199,33 @@
})
})
}
if (type == 'hideTip') {
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[legendIndex - 1],
})
if (legendIndex == 0) getData()
legendIndex--
}
if (sleep == 0) {
type = 'hideTip'
getInstance()?.setOption({
series: [obj.series[currentIndex]],
})
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[currentIndex],
})
if (currentIndex == legendData.length - 1) {
timer && clearInterval(timer)
setTimeout(() => {
chartAmi()
}, timerNumber)
}
index++
}, timerNumber)
}
async function getData() {
async function getData(init = true) {
const resData = await getRiceShrimpPrice()
Data.x_axis = resData.x_axis
Data.series = resData.series
chartsInit()
if (init) {
chartsInit()
} else {
chartLineAmi()
}
}
onBeforeMount(() => {

81
src/views/visualization/components/DXLX.vue
View File

@ -31,19 +31,23 @@
const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>)
async function getData() {
async function getData(init = true) {
const resData = await getRiceShrimpFlow({
year: visualizationStore.getYear,
})
Data.x_axis = resData.x_axis
Data.series = resData.series
chartsInit()
if (init) {
chartsInit()
} else {
chartLineAmi()
}
}
let legendData = [] as any
const chartsInit = () => {
function formatChartData() {
const obj = {
legendData: [] as any,
series: [] as any,
@ -51,15 +55,13 @@
Data.series.forEach(({ name, data }, index) => {
const color = chartLineColors[index % chartLineColors.length]
obj.legendData.push(name)
obj.legendData.push(name + '')
obj.series.push({
name: name,
data: data.map((e) => (e ? Number((e / 2000).toFixed(2)) : e)),
smooth: false,
data: data,
type: 'line',
smooth: false,
// symbol: 'none',
stack: 'Total',
itemStyle: {
color: color.itemColor,
},
@ -68,8 +70,12 @@
},
})
})
legendData = obj.legendData
return obj
}
const chartsInit = () => {
const obj = formatChartData()
setOptions({
grid: { left: '2%', right: '2%', top: '10%', bottom: '2%', containLabel: true },
legend: {
@ -129,39 +135,44 @@
}
let timer: any = null
function chartAmi() {
let index = 0
const timerNumber = 3000
let sleep = 1
timer && clearInterval(timer)
let currentIndex = 0
let sleep = 0
const fo = 2
timer = setInterval(() => {
const currentIndex = index % 4
sleep = index % (4 * 2)
currentIndex = index % 4
sleep = index % (4 * fo)
getInstance()?.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: currentIndex,
})
if (sleep == 7) {
chartLineAmi()
if (sleep + 1 >= 4 * fo) {
timer && clearInterval(timer)
setTimeout(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
}, timerNumber)
getData(false)
}
index++
}, timerNumber)
}
function chartLineAmi() {
const obj = formatChartData()
let index = 0
let currentIndex = 0
const timerNumber = 3000
timer && clearInterval(timer)
let legendIndex = legendData.length
let sleep = 6000 / 3000
timer = setInterval(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
if (legendIndex == legendData.length) {
currentIndex = index % legendData.length
if (currentIndex == 0) {
legendData.forEach((_, index) => {
getInstance()?.dispatchAction({
type: 'legendUnSelect',
@ -169,17 +180,21 @@
})
})
}
if (legendIndex >= 0) {
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[legendIndex - 1],
})
getInstance()?.setOption({
series: [obj.series[currentIndex]],
})
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[currentIndex],
})
if (currentIndex == legendData.length - 1) {
timer && clearInterval(timer)
setTimeout(() => {
chartAmi()
}, timerNumber)
}
if (legendIndex <= 0) {
if (sleep <= 0) getData()
sleep--
}
legendIndex--
index++
}, timerNumber)
}

70
src/views/visualization/components/DZWZ.vue
View File

@ -62,19 +62,23 @@
const { setOptions, getInstance } = useECharts(chartRef as Ref<HTMLDivElement>)
async function getData() {
async function getData(init = true) {
const resData = await getMateriel({
year: visualizationStore.getYear,
type: currentTab.value,
})
Data.x_axis = resData.x_axis
Data.series = resData.series
chartsInit()
if (init) {
chartsInit()
} else {
chartLineAmi()
}
}
let legendData = [] as any
const chartsInit = () => {
function formatChartData() {
const obj = {
legendData: [] as any,
series: [] as any,
@ -112,7 +116,11 @@
})
legendData = obj.legendData
return obj
}
const chartsInit = () => {
const obj = formatChartData()
setOptions({
grid: { left: '2%', right: '2%', top: '50px', bottom: '2%', containLabel: true },
legend: {
@ -192,36 +200,40 @@
function chartAmi() {
let index = 0
const timerNumber = 3000
let sleep = 1
timer && clearInterval(timer)
let currentIndex = 0
let sleep = 0
const fo = 2
timer = setInterval(() => {
const currentIndex = index % 4
sleep = index % (4 * 2)
currentIndex = index % 4
sleep = index % (4 * fo)
getInstance()?.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: currentIndex,
})
if (sleep == 7) {
chartLineAmi()
if (sleep + 1 >= 4 * fo) {
timer && clearInterval(timer)
setTimeout(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
}, timerNumber)
getData(false)
}
index++
}, timerNumber)
}
function chartLineAmi() {
const obj = formatChartData()
let index = 0
let currentIndex = 0
const timerNumber = 3000
timer && clearInterval(timer)
let legendIndex = legendData.length
let sleep = 6000 / 3000
timer = setInterval(() => {
getInstance()?.dispatchAction({
type: 'hideTip',
})
if (legendIndex == legendData.length) {
currentIndex = index % legendData.length
if (currentIndex == 0) {
legendData.forEach((_, index) => {
getInstance()?.dispatchAction({
type: 'legendUnSelect',
@ -229,17 +241,21 @@
})
})
}
if (legendIndex >= 0) {
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[legendIndex - 1],
})
getInstance()?.setOption({
series: [obj.series[currentIndex]],
})
getInstance()?.dispatchAction({
type: 'legendSelect',
name: legendData[currentIndex],
})
if (currentIndex == legendData.length - 1) {
timer && clearInterval(timer)
setTimeout(() => {
chartAmi()
}, timerNumber)
}
if (legendIndex <= 0) {
if (sleep <= 0) getData()
sleep--
}
legendIndex--
index++
}, timerNumber)
}