禁用标签时Amchart组合图表标签重叠

Question

我有一个amchart代码笔中的组合图：https://codepen.io/amcharts/pen/68f79624039495969a04c80b86a90272

"valueAxes": [{
"id": "v1",
"unit": "%",
"position": "right",
"title": "GDP growth rate",
}, {
"id": "v2",
"unit": "$",
"unitPosition": "left",
"position": "left",
"title": "Sales volume (M)"
}],

我想把所有的标签都放在右边，所以我做这个例子如下：https://jsfiddle.net/hansyulian/ymb2vcsa/

"valueAxes": [{
"id": "v1",
"unit": "%",
"position": "right",
"title": "GDP growth rate",
}, {
"id": "v2",
"unit": "$",
"unitPosition": "left",
"position": "right",
"title": "Sales volume (M)"
}],

我注意到标签重叠，可以通过在标签中添加一些"offset"来解决，如下所示：https://jsfiddle.net/hansyulian/ymb2vcsa/2/

"valueAxes": [{
"id": "v1",
"unit": "%",
"position": "right",
"title": "GDP growth rate",
}, {
"id": "v2",
"unit": "$",
"unitPosition": "left",
"position": "right",
"offset": 70,
"title": "Sales volume (M)"
}],

然后，我尝试使用"labelsEnabled":false禁用标签，如下所示：https://jsfiddle.net/hansyulian/ymb2vcsa/3/

"valueAxes": [{
"id": "v1",
"unit": "%",
"position": "right",
"labelsEnabled": false,// comment this and the label no longer overlapped
"title": "GDP growth rate",
}, {
"id": "v2",
"unit": "$",
"unitPosition": "left",
"position": "right",
"labelsEnabled": false, // comment this and the title no longer overlapped
"offset": 70, // this offset not working if labelsEnabled = false
"title": "Sales volume (M)"
}],

结果是由于"offset"被禁用，y轴标题重叠。有什么办法解决这个问题吗？

Answer 1

您可以将labelsEnabled设置为true，也可以将addClassNames设置为true。

然后使用CSS隐藏标签：

.value-axis-v2 .amcharts-axis-label {
visibility: hidden;
}

请查看此处的示例：https://jsfiddle.net/ymb2vcsa/7/

Answer 2

好的，显然我的一位同事给了我答案，但在我们向AmCharts筹集支持票之前，他拒绝在这里回答(归功于TCY(。显然，使用fontSize : 0有一个简单的破解方法，我们可以将标签的文本隐藏如下：

https://jsfiddle.net/hansyulian/ymb2vcsa/8/

"valueAxes": [{
"id": "v1",
"unit": "%",
"position": "right",
"labelsEnabled": true, // comment this and the label no longer overlapped
"title": "GDP growth rate",
"fontSize": 0
}, {
"id": "v2",
"unit": "$",
"unitPosition": "left",
"position": "right",
"labelsEnabled": true, // comment this and the title no longer overlapped
"offset": 70, // this offset not working if labelsEnabled = false
"title": "Sales volume (M)",
"fontSize": 0
}],

这使得图表更有意义，同时我们可以在图表中应用图例，使人们能够看到每种图表类型中代表的列是什么