具有已知值的序列上的Amcharts V4标记值

Question

我有从CSV外部文件加载的amChart4 XYChart。

如何在系列中标记最大值，写入文件时知道最大值。因此，只需要用项目符号标记数据点即可。

var maxNm = 404.24;

var maxHP = 327.7;

Se代码和从CSV加载的工作图表。

https://codepen.io/lasse-kofoed/pen/WNbNXxe

// Themes begin
    am4core.useTheme(am4themes_material);
    am4core.useTheme(am4themes_animated);
// Themes end

// Create chart instance
    var chart = am4core.create("chartdiv", am4charts.XYChart);

    chart.responsive.enabled = true;        

// Set up data source
    chart.dataSource.url = "https://master.tus.io/files/a6bfda6a8051313c0c0b1d7129a75786+DB7aQwWVBca.GAK4H6FLamUT58549Asv6vLoR9kEJySMEVOsFlCSi9eqzgMYLhqXdMJDZoTE0C90HuVUUKD7KoKdFjlM0f1IRkkQ0L5X6iykr8kSsyNWTtPkcmzIFwDp";

    chart.dataSource.parser = new am4core.CSVParser();
    chart.dataSource.parser.options.useColumnNames = true;

// Increase contrast by taking evey second color
    chart.colors.step = 2;

    chart.dataSource.events.on("error", function (ev) {
      console.log("Oopsy! Something went wrong");        
    });


// Create value axis
    var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
    valueAxis.tooltip.disabled = true;
    valueAxis.title.text = "Power & Torque";

    var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
    categoryAxis.dataFields.category = "Rpm";

// Create serie Nm
    var nm = chart.series.push(new am4charts.LineSeries());
    var maxNm = 404.24;
    nm.dataFields.valueY = "Nm";
    nm.dataFields.categoryX = "Rpm";
    nm.yAxis = valueAxis;
    nm.name = "Nm";
    nm.strokeWidth = 1;
    //nm.tensionX = 0.7;
    nm.tooltipText = "{valueY.value} Nm";

    var hp = chart.series.push(new am4charts.LineSeries());
    var maxHP = 327.7;
    hp.dataFields.valueY = "Hp";
    hp.dataFields.categoryX = "Rpm";
    hp.yAxis = valueAxis;
    hp.name = "Hp";
    hp.strokeWidth = 1;
    //hp.tensionX = 0.7;
    hp.tooltipText = "{valueY.value} Hp";

// Add legend
    chart.legend = new am4charts.Legend();

// Add cursor
    chart.cursor = new am4charts.XYCursor();  

Answer 1

用结果更新了CodePen。它没有设置子弹。但是带有文字的标记。

var nmMaxBullet = nm.bullets.push(new am4charts.LabelBullet);
nmMaxBullet.fontSize = "18px";
nmMaxBullet.fontWeight = "bold"
nmMaxBullet.locationY = -0.05;


nmMaxBullet.label.adapter.add("textOutput", function(text, target) {  
    if(target.dataItem && target.dataItem.valueY == maxNm) {      
      return maxNm +" Nm @ " + maxNmRpm;
    }   
});