honeymoon_的博客

图表宽和高都是自适应，父组件有tab切换功能，子组件显示echars图，当父组件进行tab切换时，子组件的图表初始化时无法获取宽和高，导致echars图不能完全显示。

1.问题描述在echars图中，通过坐标轴指示器axispointer触发时，在legend图例中动态展示数据（与tooltip提示框相似，相当于把tooltip中的数据显示在legend中）。2.解决思路（1）若想在legend中动态展示数据，就要先想到legend中的数据是随着axispointer（坐标轴指示器）的移动而动态显示的。因此，要通过axispointer去获取想要展示的数据。（2）由于legend formatter函数的参数会自动遍历，因此选择switch，可以改变不同的图例le

myChart.on('globalout', e => { console.log(e);})globalout事件：鼠标移出坐标系触发。

解决方法：resize()<template> <div id="lineChart"></div></template>mounted() { window.addEventListener('resize', this.resize); myChart = echarts.init(document.getElementById('lineChart'));},beforeDestroy() { window.removeEv

类目轴中在 boundaryGap 为 true 的时候有效，可以保证刻度线和标签对齐。如下图： xAxis: { type: 'category', axisTick:{ //在设置boundaryGap 为 true的前提下，设置alignWithLabel使刻度线和标签对齐 alignWithLabel:true }, data: ['19-06-05', '19-06-06', '19-06-07',

记录echars加载动画loading需求的完成过程注：绘制echars图表和请求接口不在同一个组件基于准备好的dom，初始化echarts实例myChart = echarts.init(document.getElementById('kLine'));告诉父组件可以请求数据了this.$emit('initSuccess');//父组件监听这个方法handleKLineSuccess() { //调用封装好的请求接口方法，请求数据 this.getFirs

yAxis: { minInterval: 1,},