You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
2.2 KiB
79 lines
2.2 KiB
<template></template> |
|
|
|
<script lang="ts" setup> |
|
import { useStore } from "vuex"; |
|
import { get, post, put, delate } from "@/config/axios"; |
|
import { reactive, onMounted, ref } from "vue"; |
|
|
|
const { state, commit, dispatch } = useStore(); |
|
|
|
const prop = defineProps({ |
|
title: { |
|
type: String, |
|
default: 'Smoothed Line' |
|
}, |
|
name: { |
|
type: String |
|
}, |
|
xAxis: { |
|
type: Array, |
|
default: [] |
|
}, |
|
data: { |
|
type: Array, |
|
default: [] |
|
}, |
|
markLine: { |
|
type: String |
|
}, |
|
unit: { |
|
type: String |
|
} |
|
}) |
|
|
|
const options = { |
|
title: { |
|
text: "",//标题 |
|
left: "center" |
|
}, |
|
tooltip: { |
|
trigger: "axis", |
|
formatter: '{b}' + '<br>' + |
|
'<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:#5470c6"></span>' |
|
+ '<span style="float:right;margin-left:10px;font-size:14px;color:#666;font-weight:900"/>' + '{c}' + '次' |
|
}, |
|
xAxis: { |
|
type: "category", |
|
data: [] |
|
}, |
|
yAxis: { |
|
type: "value" |
|
}, |
|
series: [ |
|
{ |
|
data: [], |
|
type: "line", |
|
smooth: true, |
|
markLine: { |
|
symbol: 'none', //['none']表示是一条横线；['arrow', 'none']表示线的左边是箭头，右边没右箭头；['none','arrow']表示线的左边没有箭头，右边有箭头 |
|
label: { |
|
position: "end" //将警示值放在哪个位置，三个值“start”,"middle","end" 开始 中点 结束 |
|
}, |
|
data: [{ |
|
silent: false, //鼠标悬停事件 true没有，false有 |
|
lineStyle: { //警戒线的样式 ，虚实 颜色 |
|
type: "solid", //样式 ‘solid’和'dotted' |
|
color: "#FA3934" |
|
}, |
|
yAxis: 22 // 警戒线的标注值，可以有多个yAxis,多条警示线 或者采用 {type : 'average', name: '平均值'}，type值有 max min average，分为最大，最小，平均值 |
|
}] |
|
} |
|
}, |
|
], |
|
}; |
|
|
|
onMounted(() => { }); |
|
</script> |
|
<style lang="scss" scoped> |
|
//@import url(); 引入公共css类 |
|
</style> |