vue+echarts实现y轴为百分比
npm install echarts --save<template><div id="main" style="width: 600px; height: 400px"></div></template><script>import * as echarts from 'echarts'export default {data() {
·
npm install echarts --save
<template>
<div id="main" style="width: 600px; height: 400px"></div>
</template>
<script>
import * as echarts from 'echarts'
export default {
data() {
return {
option: {
xAxis: { //x轴设置
type: 'category',
boundaryGap: false,
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
},
yAxis: { //y轴设置
type: 'value',
axisLabel: { //y轴设置为%
show: true,
interval: 'auto',
formatter: '{value} %',
},
max: 100, //最大值
min: 0, //最小值
},
series: [
{
data: [100, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
type: 'line',
areaStyle: {},
},
],
},
}
},
mounted() {
let myChart = echarts.init(document.getElementById('main'))
// 指定图表的配置项和数据
let option = this.option
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option)
},
}
更多推荐
已为社区贡献1条内容
所有评论(0)