Javascript 如何在折线图或散点图中显示自定义标签

我正在像这样向图表中添加数据

const data = [
    ["2020-05-22 14:20:22", "173.9"],
    ["2020-05-22 14:20:40", "175.3"],
    ["2020-05-22 14:20:58", "172.4"]
]

function stringToDate(s)  {
  s = s.split(/[-: ]/);
  return new Date(s[0], s[1]-1, s[2], s[3], s[4], s[5]);
}

for(var key in data)
{
    var xTime = stringToDate(data[key][0]);
    var yVal  =  parseFloat(data[key][1]);
    series.add({ x: xTime.getTime() - dateOrigin.getTime(), y: yVal})
}

如何向其显示自定义标签，例如，我想显示线上系列的完整日期，以及其他散点图的完整日期，我想显示如下所示的自定义标签

series.add({ x: xTime.getTime() - dateOrigin.getTime(), y: yVal , label : "my own text" })

---

要使用日期时间轴显示系列的完整日期，您可以查看我之前发布的答案：排序版本是根据定义轴的轴刻度策略时定义的格式选项

自定义标签可以通过创建来完成。可以使用设置的文本格式化程序定义记号内的文本。formatter函数获取位置和记号本身作为参数，因此如果需要，可以使用这些参数定义记号内的文本

const tick=lineSeries.axix.addCustomTick（）
.setGridStrokeLength（0）
.setTextFormatter（（）=>“我的文本”）
.setValue（数据频率*50）

有关自定义日期时间格式和自定义记号的使用的实现，请参见下面的代码段。该代码段基于LightningChart JS交互示例

//从LightningChartJS中提取所需的部分。
常数{
光照图，
战略,，
数据模式，
空注，
空位线
}=lcjs
//创建XY图表。
const dateOrigin=新日期（2008,0,1）
常量图表=lightningChart（）.ChartXY({
defaultAxisXTickStrategy:AxisTickStrategies.DateTime(
日期来源，
未定义，
{
年份：'数字'，
月：“长”，
日期：'数字'，
小时：'数字'，
分钟：“数字”
}
)
})
.setTitle（“客户满意度”）
setPadding（{right:'5'}）
//添加一个渐进的线条系列。
//使用DataPatterns对象为线系列选择水平渐进模式。
const lineSeries=chart.addLineSeries（{dataPattern:DataPatterns.horizontalProgressive}）
.setName（“客户满意度”）
//为每个月生成一些积分
常数数据频率=30*24*60*60*1000
//很好地设置视图。
chart.getDefaultAxisY（）
.setScrollStrategy（未定义）
.setInterval（0，100）
.setTitle（“满意度%”）
//用于绘图的数据
常数满足数据=[
{x:0，y:0}，
{x:1，y:8}，
{x:2，y:12}，
{x:3，y:18}，
{x:4，y:22}，
{x:5，y:32}，
{x:6，y:40}，
{x:7，y:48}，
{x:8，y:50}，
{x:9，y:54}，
{x:10，y:59}，
{x:11，y:65}，
{x:12，y:70}，
{x:13，y:68}，
{x:14，y:70}，
{x:15，y:69}，
{x:16，y:66}，
{x:17，y:65.4}，
{x:18，y:64}，
{x:19，y:65}，
{x:20，y:63.5}，
{x:21，y:62}，
{x:22，y:61.2}，
{x:23，y:63}，
{x:24，y:61}，
{x:25，y:62}，
{x:26，y:62}，
{x:27，y:60}，
{x:28，y:57.8}，
{x:29，y:58}，
{x:30，y:61}，
{x:31，y:59}，
{x:32，y:63}，
{x:33，y:61}，
{x:34，y:61.8}，
{x:35，y:62}，
{x:36，y:59.9}，
{x:37，y:58}，
{x:38，y:60}，
{x:39，y:63}，
{x:40，y:59.5}，
{x:41，y:62.5}，
{x:42，y:59.7}，
{x:43，y:57}，
{x:44，y:61}，
{x:45，y:59}，
{x:46，y:61}，
{x:47，y:65}，
{x:48，y:62}，
{x:49，y:60}，
{x:50，y:58}，
{x:51，y:59}，
{x:52，y:61}，
{x:53，y:64}，
{x:54，y:65.5}，
{x:55，y:67}，
{x:56，y:68}，
{x:57，y:69}，
{x:58，y:68}，
{x:59，y:69.5}，
{x:60，y:69.9}，
{x:61，y:68.5}，
{x:62，y:67}，
{x:63，y:65}，
{x:64，y:63}，
{x:65，y:60}，
{x:66，y:61.6}，
{x:67，y:62}，
{x:68，y:61}，
{x:69，y:60}，
{x:70，y:63.3}，
{x:71，y:62.7}，
{x:72，y:64.3}，
{x:73，y:63}，
{x:74，y:61.2}，
{x:75，y:60}，
{x:76，y:61}，
{x:77，y:64}，
{x:78，y:61.9}，
{x:79，y:61}，
{x:80，y:58}，
{x:81，y:59}，
{x:82，y:60.5}，
{x:83，y:61}，
{x:84，y:63}，
{x:85，y:64.5}，
{x:86，y:65}，
{x:87，y:66.2}，
{x:88，y:64.9}，
{x:89，y:63}，
{x:90，y:62}，
{x:91，y:63}，
{x:92，y:61.8}，
{x:93，y:62}，
{x:94，y:63}，
{x:95，y:64.2}，
{x:96，y:63}，
{x:97，y:61}，
{x:98，y:59.7}，
{x:99，y:61}，
{x:100，y:58}，
{x:101，y:59}，
{x:102，y:58}，
{x:103，y:58}，
{x:104，y:57.5}，
{x:105，y:59.2}，
{x:106，y:60}，
{x:107，y:61.9}，
{x:108，y:63}，
{x:109，y:64.1}，
{x:110，y:65.9}，
{x:111，y:64}，
{x:112，y:65}，
{x:113，y:62}，
{x:114，y:60}，
{x:115，y:58}，
{x:116，y:57}，
{x:117，y:58.2}，
{x:118，y:58.6}，
{x:119，y:59.3}，
{x:120，y:61}
]
//向系列中添加点
添加（satisfactionData.map（（点）=>（{x:point.x*dataFrequency，y:point.y}）））
//显示每个点的自定义结果表
lineSeries.SetResultableFormatter（（生成器、系列、xValue、yValue）=>{
返回生成器
.addRow（“客户满意度”）
.addRow（series.axisX.formatValue（xValue））
.addRow（Y值.toFixed（2）+“%”）
})
常量tick=lineSeries.axix.addCustomTick（）
.setGridStrokeLength（0）
.setTextFormatter（（）=>“我的文本”）
.setValue（数据频率*50）