|
|
@@ -7,6 +7,8 @@
|
|
|
|
|
|
<script>
|
|
|
import echartMixins from "@/utils/resizeMixins";
|
|
|
+import echarts from "@/api/cpms/echarts.min";
|
|
|
+
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -21,8 +23,34 @@ export default {
|
|
|
draw() {
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
this.chart = this.echarts.init(document.getElementById('bottomRightChart2'))
|
|
|
+ // let lineData = [
|
|
|
+ // 820, 932, 901, 934, 1290, 1330, 1320
|
|
|
+ // ];
|
|
|
let option={
|
|
|
+ legend:{
|
|
|
+ orient:'horizontal',
|
|
|
+ x: 'left',
|
|
|
+ y: 'top',
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ top: '16%', // 等价于 y: '16%'
|
|
|
+ left: '3%',
|
|
|
+ right: '8%',
|
|
|
+ bottom: '3%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
xAxis: {
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ // 设置x轴颜色
|
|
|
+ color: '#ffffff'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ rotate: 0, // 旋转角度
|
|
|
+ interval: 1 //设置X轴数据间隔几个显示一个，为0表示都显示
|
|
|
+ },
|
|
|
+ boundaryGap: false,
|
|
|
type: 'category',
|
|
|
data: [
|
|
|
'00:00-03:00',
|
|
|
@@ -36,14 +64,60 @@ export default {
|
|
|
]
|
|
|
},
|
|
|
yAxis: {
|
|
|
- type: 'value'
|
|
|
+ type: 'value',
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ // 设置x轴颜色
|
|
|
+ color: '#ffffff'
|
|
|
+ }
|
|
|
+ },
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
- data: [820, 932, 901, 934, 1290, 1330, 1320],
|
|
|
+ data: [500, 680, 733, 470, 1290, 980, 1320,1580],
|
|
|
type: 'line',
|
|
|
- smooth: true
|
|
|
- }
|
|
|
+ smooth: 0.5,
|
|
|
+ symbolSize: 10,
|
|
|
+ areaStyle:{
|
|
|
+ color:new echarts.graphic.LinearGradient(0,0,0,1,[{
|
|
|
+ offset:0,
|
|
|
+ color:'#92bda6',
|
|
|
+ },{
|
|
|
+ offset: 1,
|
|
|
+ color: '#2480bb'
|
|
|
+ }
|
|
|
+ ])
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ lineStyle:{
|
|
|
+ width:1,
|
|
|
+ type:'solid'
|
|
|
+ },
|
|
|
+ borderColor:'red',
|
|
|
+ color: "#92bda6"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ // {
|
|
|
+ // name: 'HP',
|
|
|
+ // type: "bar",
|
|
|
+ // barGap: "-100%",
|
|
|
+ // stack: 'Ad',
|
|
|
+ // barWidth: 10,
|
|
|
+ // itemStyle: {
|
|
|
+ // normal: {
|
|
|
+ // barBorderRadius: 5,
|
|
|
+ // color: new this.echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
+ // { offset: 0, color: "#956FD4" },
|
|
|
+ // { offset: 1, color: "#3EACE5" }
|
|
|
+ // ])
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // z: -12,
|
|
|
+ // data: lineData
|
|
|
+ // },
|
|
|
]
|
|
|
}
|
|
|
this.chart.setOption(option);
|
liu85600613