Question

我在这里有 amchart codepen的组合图表：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)"
  }],

结果是y轴标题重叠，因为"offset"被禁用。有什么方法可以解决这个问题吗？

Answer 1

您可以将$('#tableId').bootstrapTable({data: myFreshData});设置为YYYY-MM-DD YYYY-MM-DD HH:MM YYYY-MM-DD HH:MM:SS YYYY-MM-DD HH:MM:SS.SSS YYYY-MM-DDTHH:MM YYYY-MM-DDTHH:MM:SS YYYY-MM-DDTHH:MM:SS.SSS HH:MM HH:MM:SS HH:MM:SS.SSS now DDDDDDDDDD并将addClassNames设置为labelsEnabled。

然后使用CSS隐藏标签：

true

查看此处的示例：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
  }],

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

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

2 个答案: