怎么动态给echarts柱状图添加柱子

Posted 2023-05-04

参考技术A 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<div id="p"></div>
// 路径配置
require.config(
paths:
'echarts': '/public/echarts-2.2.7/doc/example/www/js'

);
// 使用
require(
[
'echarts',
'echarts/chart/pie'
.
.
.
], DrawCharts);
function DrawCharts(ec)
var char1 = ec.init(document.getElementById('p'));
var ecConfig = require('echarts/config');
char1.on(ecConfig.EVENT.CLICK, eConsole);
......//正常的echarts

//点击事件
function eConsole(param)
if (typeof param.seriesIndex == 'undefined')
return;

if (param.type == 'click')
var name = param.name;
alert(name)


重点就是 ：
var ecConfig = require('echarts/config');
char1.on(ecConfig.EVENT.CLICK, eConsole);
这两步本回答被提问者采纳

解决Echarts柱状图上的数字重叠问题

参考技术A 问题描述：柱状图个别数值太小，数字重叠，看不清数字（如下图）

stack 属性赋值不一样的时候，柱状图就会分开显示，如果赋值一样，那么这些数据都会显示到一个柱子上。

显示效果如下

这样改还有一个问题，就是如果数据组数太多的时候，柱状图太多会跌在一起，这时我们在请求拿到数据赋值的时候，约束只显示5组数据就可以了

显示效果如下

根据最大值动态隐藏：在本地定义一个数组的最大值maxNum，请求拿到数据的时候遍历数组，拿到数组的最大值并赋值给maxNum，当最大值是数值的10倍就隐藏该数值