vue+echarts

1.vue全局引入echarts

//1. 在项目根目录终端里执行：
npm install --save echarts
//2.在main.js中：
import echarts from 'echarts'
Vue.prototype.$echarts = echarts
//3. 在单个的.vue文件
const mychart = this.$echarts.init(document.getElementById('evaluateDetailCanvas'))
mychart..setOption({
...
})

2.vue中使用echarts用到tooltip遮罩提示信息不显示的问题

检查下自己写的初始化元素是canvas 还是其他

// template：
<div class="evaluateDetailCanvasWrapper" id='evaluateDetailCanvas'></div>

// js
const $chart = this.$echarts.init(document.getElementById('evaluateDetailCanvas'))
$chart.setOption({
    color: ['#3398DB'],
    tooltip: {
        trigger: 'axis',
        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [
        {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis: [
        {
            type: 'value'
        }
    ],
    series: [
        {
            name: '直接访问',
            type: 'bar',
            barWidth: '60%',
            data: [10, 52, 200, 334, 390, 330, 220]
        }
    ]
})

// 如果是div的话 配置这个 tooltip 可以显示提示信息
// 如果是canvas的话 配置这个 tooltip 不显示提示信息