当前位置: 代码迷 >> 综合 >> Echars-折线图
  详细解决方案

Echars-折线图

热度:55   发布时间:2024-01-20 22:29:24.0
<!-- 图表 -->
<div class="chartdiv bg-white border"><div v-if="currentData.length===0" class="no-data" style="height:300px;">暂无数据</div><div v-show="currentData.length>0" ref="netValueChart" style="height:300px;"></div>
</div>
//初始化图表chartInit() {if (!this.lineArt) this.lineArt = echarts.init(this.$refs["netValueChart"]);const option = {xAxis: {type: "category",boundaryGap: false,data: this.fundNavChartDate},yAxis: {type: "value"},tooltip: {trigger: "axis",axisPointer: {type: "cross",label: {backgroundColor: "#6a7985"}}},legend: {data: [第一组数据,第二组数据]},series: [{data: this.dataOne,name: "第一组数据",type: "line",smooth: true,symbol: "none",lineStyle: { normal: { width: 2 } },itemStyle: {normal: {color: "#e99400",lineStyle: {color: "#e99400"}}},areaStyle: {normal: {color: new echarts.graphic.LinearGradient(0, 0, 0, 0,[{ offset: 0, color: "#e99400" },{ offset: 0.7, color: "#FFE2C6" },{ offset: 1, color: "#ffffff" }])}}},{data: this.dataTwo,name: "第二组数据",type: "line",smooth: true,symbol: "none",lineStyle: { normal: { width: 2 } },itemStyle: {normal: {color: "#409EFF",lineStyle: {color: "#409EFF"}}},areaStyle: {normal: {color: new echarts.graphic.LinearGradient(0, 0, 0, 0,[{ offset: 0, color: "#409EFF" },{ offset: 0.1, color: "#409EFF" },{ offset: 1, color: "#ffffff" }])}}}]};this.lineArt.setOption(option);}

 

  相关解决方案