echarts配置项title
作者:互联网
<template>
<div>
<!-- <h2>本月抄表完成率</h2> -->
<!-- <div id="chart1" style="width: 80%;height: 400px;top: 50px;left: 10%;border: 3px solid #000;"></div> -->
<div ref="barg0" style="width: 600px;height:400px;"></div> //设置一个容器
</div>
</template>
<script> import echarts from 'echarts' export default { data () { return { option : { title: { text:'德清县', // 仪表盘标题。 show: true, // 是否显示标题,默认 true。 offsetCenter: [0,"20%"],//相对于仪表盘中心的偏移位置,数组第一项是水平方向的偏移,第二项是垂直方向的偏移。可以是绝对的数值,也可以是相对于仪表盘半径的百分比。 fontSize: 20,// 文字的字体大小,默认 15。 textStyle:{ color:'#fff' //设置颜色 }, left:'center' //left:'center' 这样就可以让标题在 文本中图表中居中了 }, tooltip : { formatter: "{a} <br/>{b} : {c}%" }, toolbox: { feature: { restore: {}, saveAsImage: {} }, show : false //这个可以让默认的 编辑按钮 还原和保存图 隐藏 }, series: [ { name: '业务指标', type: 'gauge', detail: {formatter:'{value}%'}, data: [{value: 50, name: ''}] //this.option.series[0].data[0].value } ] } } }, methods: { customized(){ var chart1 = echarts.init(this.$refs.barg0); setInterval(() =>{ this.option.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0; chart1.setOption(this.option, true); },2000); chart1.setOption(this.option) } }, mounted() { this.customized() // let _this = this; this.$nextTick(() => { let bargraph0 = echarts.init(this.$refs.barg0); bargraph0.setOption(this.option); window.addEventListener("resize", bargraph0.resize);
// let bargraph = echarts.init(_this.$refs.barg); // bargraph.setOption(_this.option2); // window.addEventListener("resize", bargraph.resize);
// let bargraph2 = echarts.init(_this.$refs.barg2); // bargraph2.setOption(_this.option3); // window.addEventListener("resize", bargraph2.resize); // }); }) } } </script>
<style lang=""> </style>
标签:option,title,setOption,配置,init,let,echarts,resize 来源: https://www.cnblogs.com/xiaoxiaoxun/p/11250905.html