在SpringBoot项目引入Echarts

在SpringBoot项目引入Echarts,第1张

项目导入依赖
  1. 在项目中添加jar包依赖参数,npm install echarts --save (后面加上参数–save是什么意思)
  2. 在.vue文件的中加入ecahrts的图标呈现div
<div id="main" style="width: 850px;height:400px;">div>
  1. 在.vue文件的中import的echarts
import * as echarts from "echarts" ;  

Echarts 初始化TypeError Cannot read properties of undefined (reading ‘init‘)

  1. 引入js代码:初始化echarts实例
// 基于准备好的dom,初始化echarts实例
data() {
      return {
		myChart:"",
	}
}
initFun(){//初始化方法
this.myChart = echarts.init(document.getElementById('main'));
//加入其它具体代码
}

Echarts图表的官方教程

  1. 不重复初始化Echarts,用完就销毁echarts.init返回的对象(生成的图片依然保存)
    There is a chart instance already initialized on the dom
  2. Echarts饼图相关
    Ecahrts的饼状图官方教程
    饼图的大小如何调节
    在Echarts扇形图中添加点击事件

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/langs/733124.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-27
下一篇 2022-04-27

发表评论

登录后才能评论

评论列表(0条)

保存