如何将自定义 y 轴标签添加到 amcharts 中的序列图表？

Question

我基本上是在对这张图表进行修改：https://www.amcharts.com/demos/reversed-value-axis/

查看文档，除了创建 "guides" 之外，我找不到添加自己的自定义 y 轴步骤和标签的方法。但是 y 值和标签仍然存在，即使我隐藏它们，我添加的 "guide" 标签的位置是在值的中间而不是在直线所在的位置。

有没有办法为我的系列图表提供自定义 y 值，或者将指南标签放在最上面的值所在的位置？

Answer 1

如果您需要在特定点自定义标签或需要创建自己的步骤，那么指南是最佳选择。

要使指南标签显示在指南的顶部，请将指南的 inside 属性设置为 true。这会将标签置于图表区域内并在线的顶部。如果您希望标签显示在图表区域之外，请将 labelOffset 设置为负值。

"valueAxes": [{
  // ...
  "guides": [{
    "value": 1.5,
    "lineAlpha": 1,
    "label": "1.5",
    "inside": true,
    "labelOffset": -35
  }]
}]

这是您链接到的图表的修改演示，说明了这一点：

var chart = AmCharts.makeChart("chartdiv", {
  "type": "serial",
  "theme": "light",
  "legend": {
    "useGraphSettings": true
  },
  "dataProvider": [{
    "year": 1930,
    "italy": 1,
    "germany": 5,
    "uk": 3
  }, {
    "year": 1934,
    "italy": 1,
    "germany": 2,
    "uk": 6
  }, {
    "year": 1938,
    "italy": 2,
    "germany": 3,
    "uk": 1
  }, {
    "year": 1950,
    "italy": 3,
    "germany": 4,
    "uk": 1
  }, {
    "year": 1954,
    "italy": 5,
    "germany": 1,
    "uk": 2
  }, {
    "year": 1958,
    "italy": 3,
    "germany": 2,
    "uk": 1
  }, {
    "year": 1962,
    "italy": 1,
    "germany": 2,
    "uk": 3
  }, {
    "year": 1966,
    "italy": 2,
    "germany": 1,
    "uk": 5
  }, {
    "year": 1970,
    "italy": 3,
    "germany": 5,
    "uk": 2
  }, {
    "year": 1974,
    "italy": 4,
    "germany": 3,
    "uk": 6
  }, {
    "year": 1978,
    "italy": 1,
    "germany": 2,
    "uk": 4
  }],
  "valueAxes": [{
    "integersOnly": true,
    "maximum": 6,
    "minimum": 1,
    "reversed": true,
    "axisAlpha": 0,
    "dashLength": 5,
    "autoGridCount": false,
    "gridCount": 10,
    "position": "left",
    "title": "Place taken",
    "guides": [{
      "value": 1.5,
      "lineAlpha": 1,
      "label": "1.5",
      "inside": true,
      "labelOffset": -35
    }]
  }],
  "startDuration": 0.5,
  "graphs": [{
    "balloonText": "place taken by Italy in [[category]]: [[value]]",
    "bullet": "round",
    "hidden": true,
    "title": "Italy",
    "valueField": "italy",
    "fillAlphas": 0
  }, {
    "balloonText": "place taken by Germany in [[category]]: [[value]]",
    "bullet": "round",
    "title": "Germany",
    "valueField": "germany",
    "fillAlphas": 0
  }, {
    "balloonText": "place taken by UK in [[category]]: [[value]]",
    "bullet": "round",
    "title": "United Kingdom",
    "valueField": "uk",
    "fillAlphas": 0
  }],
  "chartCursor": {
    "cursorAlpha": 0,
    "zoomable": false
  },
  "categoryField": "year",
  "categoryAxis": {
    "gridPosition": "start",
    "axisAlpha": 0,
    "fillAlpha": 0.05,
    "fillColor": "#000000",
    "gridAlpha": 0,
    "position": "top"
  },
  "export": {
    "enabled": true,
    "position": "bottom-right"
  }
});

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<div id="chartdiv" style="width: 100%; height: 350px;"></div>

如何将自定义 y 轴标签添加到 amcharts 中的序列图表？

How can I add custom y axis labels to serial chart in amcharts?

charts

amcharts