在vue项目中使用echarts制作3D效果柱状图

最新推荐文章于 2024-08-21 17:29:12 发布

黄-小智

最新推荐文章于 2024-08-21 17:29:12 发布

阅读量2.9k

点赞数

文章标签： vue echarts 3d

本文链接：https://blog.csdn.net/mrhxz/article/details/118214656

版权

在vue项目中使用echarts制作3D效果柱状图

1、第一步安装echarts组件。
npm install echarts
2、第二步安装好echarts后，安装echarts3d图形组件echarts-gl
npm install echarts-gl

如果package.json文件里面也可以找到这个配置，则安装成功
在这里插入图片描述
3.第三步在需要使用Echarts页面的script中附上以下代码

import * as echarts from 'echarts';
import 'echarts-gl';
require('echarts/lib/chart/bar.js');
require('echarts/lib/component/title.js');
require('echarts/lib/component/tooltip.js');

实例上代码！

<template>
  <div class="ChartAnalysis">
    <!-- 内容 -->
    <div id="main"></div>
  </div>
</template>

<script>

import * as echarts from 'echarts';
import 'echarts-gl';
require('echarts/lib/chart/bar.js');
require('echarts/lib/component/tooltip.js');
require('echarts/lib/component/title.js');

export default {
   
  name: