我试图让工具提示显示此折线图和数据集,每次我输入自己的数据时,它都会删除折线图,并且我在文档中找不到任何有关为什么会发生这种情况的信息。
理想情况下它只会显示 X 轴的值。
我这里有一个codepen https://codepen.io/ChazUK/pen/MWzgLrQ
var root = am5.Root.new("chartdiv");
root.dateFormatter.setAll({
dateFormat: "MMM, yyyy",
dateFields: ["valueX"]
});
root.setThemes([am5themes_Animated.new(root)]);
var chart = root.container.children.push(am5xy.XYChart.new(root, {}));
var cursor = chart.set(
"cursor",
am5xy.XYCursor.new(root, {
behavior: "none"
})
);
cursor.lineY.set("visible", false);
// Data
var data = [
{ date: 1680737683000, ajf: 288.02, topix: 189.64 },
{ date: 1678059283000, ajf: 278.21, topix: 184.66 },
{ date: 1675640083000, ajf: 276.12, topix: 181.57 },
{ date: 1672961683000, ajf: 265.45, topix: 179.87 },
{ date: 1670283283000, ajf: 252.86, topix: 172.25 },
{ date: 1667691283000, ajf: 263.18, topix: 180.49 }
];
// Create axes
// https://www.amcharts.com/docs/v5/charts/xy-chart/axes/
var xAxis = chart.xAxes.push(
am5xy.DateAxis.new(root, {
baseInterval: { timeUnit: "month", count: 1 },
renderer: am5xy.AxisRendererX.new(root, {}),
tooltip: am5.Tooltip.new(root, {})
})
);
var yAxis = chart.yAxes.push(
am5xy.ValueAxis.new(root, {
renderer: am5xy.AxisRendererY.new(root, {})
})
);
// Add series
// https://www.amcharts.com/docs/v5/charts/xy-chart/series/
var series = chart.series.push(
am5xy.LineSeries.new(root, {
xAxis: xAxis,
yAxis: yAxis,
valueYField: "ajf",
valueXField: "date",
tooltip: am5.Tooltip.new(root, {
labelText: "{valueX}: {valueY}"
})
})
);
series.strokes.template.setAll({
strokeWidth: 2
});
series.data.setAll(data);
series.appear(1000);
chart.appear(1000, 100);
我遇到了同样的问题,直到我添加了项目符号并将工具提示文本放入圆圈定义中。对于格式错误,我深表歉意,我在平板电脑上。
series.bullets.push(function(){
return am5.Bullet.new(root, {
sprite: am5.Circle.new(root, {
radius: 2, // you can make it small enough not to show
tooltipText: '{valueY}'
})
});
});