google-visualization - 如何为列 google-charts 添加填充
问题描述
我使用带有注释的列 google-chart。对于注释集选项alwaysOutside: true
。但我有一个问题。
对于具有最大值的列,我的注释标签会自动向下移动。
我该如何解决这种行为?
我的图表选项在这里:
const chartOptions = {
legend: 'none',
width: 750,
height: 285,
bar: { groupWidth: '95%' },
fontName: 'Open Sans',
fontSize: 14,
enableInteractivity: false,
colors: ['#FF2D55', '#4772D1'],
vAxis: {
format: '0',
baseline: 0,
viewWindowMode: 'pretty',
viewWindow: {
min: 0
}
},
annotations: {
alwaysOutside: true,
style: 'point',
stem: {
length: 5,
color: '#FFFFFF'
},
textStyle: {
fontName: 'Open Sans',
fontSize: 16,
bold: true,
color: 'black',
opacity: 1
}
},
tooltip: {
trigger: 'none'
}
};
解决方案
我自己找到了解决方案。也许有人需要。
在获得图表的数据后,我发现系列中的最大值并vAxis.minValue
动态设置选项。代码示例:
const maxValue = this.getMaxValueInSeries(chartSeries);
this.chartOptions.vAxis.minValue = maxValue + 1;
这对我有用。享受。
推荐阅读
- cube.js - 无法使用 cube.js 连接到 mongodb attlas
- wildfly - 使用 add-user.bat/add-user.sh 在 wildfly 中添加用户不会写入 mgmt-users.properties
- c++ - 有没有一种理想的方式来避免这种裸新的使用?
- mysql - 通过 React 和 Node.js 将未定义的值传递给 MySQL 数据库
- reactjs - React & Searchkit 显示更多按钮而不是默认分页
- c - connect() 在使用 IPv4 协议的套接字编程中失败
- html - 使用 display flex 在左侧放置一个 div,在右侧放置两个 div
- python - NoReverseMatch at / Reverse for 'article' with arguments '('',)' 未找到。尝试了 1 种模式:['blog/(?P
[0-9]+)$'] - linux - 如何在netbeans(linux)中将JFrame表单设置为主类
- javascript - 如何更改Vue中v-text-filed占位符的字体颜色?