添加离线地图

This commit is contained in:
GGJ
2024-12-16 20:57:17 +08:00
parent 0cd5598e8c
commit ccd07ed110
93 changed files with 20430 additions and 126 deletions

View File

@@ -0,0 +1,39 @@
<template>
<div class="default-main device pd10">
<waveForm ref="waveFormRef" />
</div>
</template>
<script lang="ts" setup>
import { ref, onMounted, watch, nextTick } from 'vue'
import waveForm from '@/components/echarts/waveForm.vue'
import { useRoute } from 'vue-router'
const route = useRoute()
const activeName = ref('')
const waveFormRef = ref()
watch(
() => activeName.value,
(val, oldVal) => {
nextTick(() => {
// waveFormRef.value && waveFormRef.value.getMakeUpDataList(route.query)
})
},
{
immediate: true,
deep: true
}
)
onMounted(() => {
// activeName.value = route.query.activeName
// waveForm.value && waveForm.value.getMakeUpDataList(route.query)
})
</script>
<style lang="scss" scoped>
.device {
overflow: hidden;
// height: calc(100vh - 130px);
}
</style>

View File

@@ -1072,13 +1072,13 @@ export default {
height: 13,
start: 0,
bottom: "20px",
end: 100,
end: 15,
},
{
start: 0,
height: 13,
bottom: "20px",
end: 100,
end: 15,
},
],
series: [
@@ -1492,13 +1492,13 @@ export default {
height: 13,
start: 0,
bottom: "20px",
end: 100,
end: 15,
},
{
start: 0,
height: 13,
bottom: "20px",
end: 100,
end: 15,
},
],
series: [

View File

@@ -17,8 +17,7 @@ import $ from 'jquery'
import * as echarts from 'echarts'
import { mainHeight } from '@/utils/layout'
import url from '@/assets/img/point.png'
import { t } from 'vxe-table'
import { set } from '@vueuse/core'
export default {
props: {
value: {
@@ -733,19 +732,21 @@ export default {
height: 13,
start: 0,
bottom: '20px',
end: 100
end: 15
},
{
start: 0,
height: 13,
bottom: '20px',
end: 100
end: 15
}
],
series: [
{
name: a,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',
@@ -757,6 +758,8 @@ export default {
{
name: b,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',
@@ -768,6 +771,8 @@ export default {
{
name: c,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',
@@ -1089,19 +1094,21 @@ export default {
height: 13,
start: 0,
bottom: '20px',
end: 100
end: 15
},
{
start: 0,
height: 13,
bottom: '20px',
end: 100
end: 15
}
],
series: [
{
name: a,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',
@@ -1113,6 +1120,8 @@ export default {
{
name: b,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',
@@ -1124,6 +1133,8 @@ export default {
{
name: c,
type: 'line',
large: true,
smooth: true,
symbol: 'none',
sampling: 'average',

View File

@@ -0,0 +1,180 @@
<template>
<div>
<MyEChart style="height: 400px;width: 100%" v-for="item in echartsList" :options="item" />
</div>
</template>
<script setup lang='ts'>
import MyEChart from '@/components/echarts/MyEchart.vue'
import { ref, reactive } from 'vue'
const props = defineProps({
wp: {
type: Object,
},
boxoList: {
type: Object,
},
value: {
type: Number,
default: 1
},
})
const echartsList: any = ref([])
const info = () => {
let num = (props.wp?.waveTitle.length - 1) / 3
for (let i = 0; i < num; i++) {
let A: any = [], B: any = [], C: any = []
props.wp?.listWaveData.forEach((item: any,) => {
A.push([item[0], item[i * 3 + 1]])
B.push([item[0], item[i * 3 + 2]])
C.push([item[0], item[i * 3 + 3]])
})
setTimeout(() => {
console.log("🚀 ~ info ~ A:", A)
echartsList.value.push({
title: {
text: i == 0 ? '123' : '',
x: 'center',
},
tooltip: {
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.55)',
borderWidth: 0,
},
dataZoom: [
{
type: 'inside',
height: 13,
start: 0,
bottom: '20px',
end: 25
},
{
start: 0,
height: 13,
bottom: '20px',
end: 25
}
],
xAxis: {
// data: data.filter(item => item.phaseType == 'A').map(item => item.time),
name: '时间',
type: 'value',
axisLine: {
show: true,
onZero: false //-----------重点
},
// splitLine: {
// show: false,
// }
},
yAxis: {
type: 'value',
name: name,
// splitLine: {
// show: false,
// }
// max: max,
// min: min
},
// legend: {
// data: ['A', 'B', 'C']
// // selectedMode: false,
// },
grid: {
top: '30px',
left: '30px'
},
color: ['#FFCC00', '#009900', '#CC0000'],
series: [
{
name: 'A相',
type: 'line',
smooth: true,
symbol: 'none',
// 开启渐进式渲染
progressive: 2000,
// 渲染阈值,大于此值则启动渐进渲染
progressiveThreshold: 5000,
sampling: 'average',
data: A
},
{
name: 'B相',
type: 'line',
smooth: true,
symbol: 'none',
// 开启渐进式渲染
progressive: 2000,
// 渲染阈值,大于此值则启动渐进渲染
progressiveThreshold: 5000,
sampling: 'average',
data: B
},
{
name: 'C相',
type: 'line',
smooth: true,
symbol: 'none',
// 开启渐进式渲染
progressive: 2000,
// 渲染阈值,大于此值则启动渐进渲染
progressiveThreshold: 5000,
sampling: 'average',
data: C
}
],
options: {
animation: false,
dataZoom: [{
type: 'inside',
height: 13,
start: 0,
bottom: '20px',
end: 10
},
{
start: 0,
height: 13,
bottom: '20px',
end: 10
}]
}
})
}, 0);
}
}
onMounted(() => {
info()
})
</script>
<style lang="scss" scoped></style>