amCharts 4 - 有没有人成功地向轴添加了小刻度？

Question

我有一个刻度为 0 到 120 的 Guage 图表。自动地，每 10 个点绘制一次主要刻度线，没有次要刻度线。我想添加以 2 为增量递增的小刻度。到目前为止，我还没有找到一种方法来执行此操作。谁能提供一些指导或更好的解决方案？

在 amCharts 3 中，配置 minor ticks 已明确记录。但是，在 amCharts 4 中，此功能已消失，似乎使用了更通用的方法。但是，我还没有找到任何有助于解决这个简单问题的文档或演示。

如果您想玩代码，this demo 是一个很好的起点。

谢谢！！

Answer 1

以下解决方案有效。它需要绘制第二个轴并使用 minGridDistance 调整比例范围和间距。以下代码的结果是：

Simple gauge chart based on the below code

我确实发现 minGridDistance 在所有比例范围内的行为都不是可预测的。对于从 0 到最大范围 120 的值范围，minGridDistance 不起作用。但是，对于 60（在下面的示例中）和 500 的最大范围，minGridDistance 工作正常。因此，需要进行一些实验。

/**
 * minor ticks
 */

var axis = chart.xAxes.push(new am4charts.ValueAxis());
axis.min = 0;
axis.max = 60;
axis.strictMinMax = true;
axis.renderer.radius = am4core.percent(100);
axis.renderer.line.strokeOpacity = 1;
axis.renderer.inside = false;
axis.renderer.labels.template.disabled = true;
axis.renderer.ticks.template.disabled = false;
axis.renderer.ticks.template.strokeOpacity = 1;
axis.renderer.ticks.template.length = 8;
axis.renderer.grid.template.disabled = true;
axis.renderer.minGridDistance = 1;


/**
 * major ticks and labels
 */
var axis2 = chart.xAxes.push(new am4charts.ValueAxis());
axis2.min = 0;
axis2.max = 120;
axis2.strictMinMax = true;
axis2.renderer.labels.template.disabled = false;
axis2.renderer.ticks.template.disabled = false;
axis2.renderer.ticks.template.length = 13;
axis2.renderer.ticks.template.strokeOpacity = 1;
axis2.renderer.grid.template.disabled = true;

amCharts 4 - 有没有人成功地向轴添加了小刻度？

amCharts 4 - Has anyone successfully added minor ticks to an axis?

axis

amcharts4