fix:图表样式修改

This commit is contained in:
wangwenrui
2020-06-03 19:20:46 +08:00
parent 0d898ab0bf
commit defde2bfb1
4 changed files with 39 additions and 3 deletions

View File

@@ -753,6 +753,10 @@
smooth: 0.2, //曲线变平滑 smooth: 0.2, //曲线变平滑
showSymbol: false, showSymbol: false,
data: [], data: [],
lineStyle: {
width: 1,
opacity: 0.9
},
type: chartInfo.type, type: chartInfo.type,
}, },
metric_name: '', metric_name: '',

View File

@@ -625,6 +625,9 @@
width: 1 width: 1
} }
}, },
axisLine: {
show: false
},
axisTick: { axisTick: {
show: false show: false
}, },

View File

@@ -5,6 +5,7 @@
<div class="chart-header">{{chartTitle}}</div> <div class="chart-header">{{chartTitle}}</div>
<div class="chart-body" ref="chartBody" :id="chartId" ></div> <div class="chart-body" ref="chartBody" :id="chartId" ></div>
<div style="position: absolute;top:50%;left:50%;" v-show="noData">No data</div>
<div class="legend-container legend-container-screen" id="legendArea" ref="legendArea" v-show="legend.length>0" v-scrollBar:legend> <div class="legend-container legend-container-screen" id="legendArea" ref="legendArea" v-show="legend.length>0" v-scrollBar:legend>
<div v-for="(item, index) in legend" :title="item.alias?item.alias:item.name" @click="clickLegend(item.name,index)" class="legend-item" :class="{'ft-gr':item.isGray}" :key="'legend_' + item.name+'_'+index"> <div v-for="(item, index) in legend" :title="item.alias?item.alias:item.name" @click="clickLegend(item.name,index)" class="legend-item" :class="{'ft-gr':item.isGray}" :key="'legend_' + item.name+'_'+index">
@@ -46,6 +47,7 @@
chartId: this.name + '-'+this.guid()+'-'+new Date().getTime(), chartId: this.name + '-'+this.guid()+'-'+new Date().getTime(),
legend:[], legend:[],
colors:chartConfig.getBgColorList(), colors:chartConfig.getBgColorList(),
noData:false,
} }
}, },
created() { created() {
@@ -99,10 +101,19 @@
} }
} }
// console.log(this.option) // console.log(this.option)
if(this.series&&this.series.length>0){
this.$set(this.option,'series',this.series); this.$set(this.option,'series',this.series);
this.noData=false;
this.chart.clear(); this.chart.clear();
this.chart.setOption(this.option); this.chart.setOption(this.option);
}else{
this.noData=true;
let option=chartConfig.getOption('noData');
this.chart.clear();
this.chart.setOption(option);
}
//坐标轴label鼠标悬浮提示 //坐标轴label鼠标悬浮提示
if (this.axisTooltip) { if (this.axisTooltip) {
let tooltipDom = document.querySelector(".axis-tooltip"); let tooltipDom = document.querySelector(".axis-tooltip");

View File

@@ -88,6 +88,12 @@
axisPointer: {//y轴上显示指针对应的值 axisPointer: {//y轴上显示指针对应的值
show: true, show: true,
}, },
axisLine: {
show: false
},
axisTick: {
show: false
},
splitLine:{ splitLine:{
show:true, show:true,
lineStyle: { lineStyle: {
@@ -107,6 +113,12 @@
width: 1 width: 1
} }
}, },
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: { axisLabel: {
// formatter:null, // formatter:null,
}, },
@@ -336,6 +348,9 @@
splitLine:{ splitLine:{
show:true show:true
}, },
axisLine: {
show: false
},
axisTick: { axisTick: {
show: false show: false
}, },
@@ -346,6 +361,9 @@
splitLine:{ splitLine:{
show:true show:true
}, },
axisLine: {
show: false
},
axisTick: { axisTick: {
show: false show: false
}, },