项目如何使用echarts插件画图

在html部分某个标签内绘制图表,需要给元素设置id,方便echarts获取到元素。
然后是js部分:

const myCharts = this.$echarts.init(document.getElementById('myCharts'));
  myCharts.setOption({
    xAxis:{ // X轴
      type:'categary',
      data:['一号','二号','三号']
    },
    yAxis:{splitLine:{show:false}}, // Y轴
    color:'',//节点,线条,标签,填充区的颜色
    tooltips:{
    	trigger: 'axis',
        formatter: function(e) { // 给提示框添加的点击事件
            console.log(e);
        },
        triggerOn: 'click'
    },//提示框
    series:[{
      name:'小明',
      type:'line',//line 折线图,funnel 倒金字塔,bar柱形图,pie扇形图
      areaStyle:{},//填充区样式
      lineStyle:{},//数据线样式
      itemStyle:{},//数据节点样式
      label:{show:true,position:'top'},//标签样式
      data:[5,34,23]
    }]
  })

以后关于echarts的功能可能会在这篇文章后面持续补充。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值