Javascript Highcharts呈现周期（大量标签格式化程序调用）

tl；包括博士

我有一个

yAxis.labels.formatter

/**
 * Formats yAxis labels in order to include the min/max dates of the row
 *
 * /!\ Scared of performance issues
 * /!\ because the formatter is called 4 times on init,
                                       twice on resize, 
                                       and once on update
 * /!\ On top of that, the formatter is called once per category (label)
 * /!\ and my (poopy) function loops over all the data, each time
 * /!\ as a result, we have
 *          => 4 x nbOfCategories x nbOfData
 *  calls of this function :( --> see console logs
 */

如前所述，在初始渲染时，formatter函数按类别调用4次（我当前的实现每次都会循环所有数据，我知道这是一个非常糟糕的想法，但这会有所改变：请参阅“真实问题”）。在前两次调用中，

this.chart.series[0].data

仍然为空，但如果我尝试跳过该选项（通过注释的

行79

），则图表将在没有正确标签格式的情况下实例化（即使我的函数仍被调用了两次）（这已经很奇怪了，不是吗？

我怀疑HighCharts有某种生命周期，顺序，用于绘制/更新图表导致这种情况，但不知道是哪个

真正的问题 我的真正的问题是“我应该怎么做（格式化轴标签）/有没有更便宜的方法手动“强制”更新标签？”

我并不是在寻找一个优化的函数（但这些函数仍然受到欢迎），因为我已经计划在HighCharts之外计算这些标签，并将它们作为

userOptions

传递，以便将成本从

4 x NBOF类别x nbOfData

降低到

4 x NBOF类别

，但理想情况下，我想要一种方法将其简化为

nbOfCategories

（比如在更新系列数据时只有一个调用）

tl；博士：

---

是否有一种方法可以减少初始渲染时使用HighCharts的“生命周期”调用标签格式化程序的次数（目前为4次）？

我认为将yAxisCatergoryMinMaxValueFormatter函数的结果作为id附加到数据点并在格式化程序中显示可能是更好的解决方案

for (let i of data1){
    i.id =  "" + i.name + "<br><b>" + toDdMmDateFormat(new Date(i.start)) + " — " + toDdMmDateFormat(new Date(i.end)) + "</b>"
}

---

演示：

如果每行有多个任务，则此操作不起作用。我试图显示整行/行/类别的“总计”（

-

），而每行有多个任务。在演示中，如果在同一类别上获得多个数据，则标签上仅显示第一个数据的

id

，而不是“总计”。我想我会保留我的解决方案（除非为了更好的性能我会对它进行预处理）。我似乎也没有找到一种方法，在不完全破坏图表的情况下，在事后简单地更新ylabel……是的，你是对的。我修改了逻辑。现在，当每行有多个任务时，它就可以工作了：（1/2）啊，是的，我想我会做类似的事情（预处理这些极端情况并分配到某个地方）。不幸的是，我的数据并非总是按顺序到达，除了每行有多个任务外，我还使用

parent

属性创建组（层次结构）等。。。但这很容易管理。我发现最令人担忧的是

yAxis

标签不会在数据更新时更新。你可以在你的演示上或这一个（拖放，然后点击更新/重画按钮，你可能会看到xLabels根据宽度更新，但不是Ys）（2/2）我打算创建另一个关于这两件事的SO问题：我认为这会更好，以避免混乱，如果SO上的新问题将被打开。

formatter(){
    let data = this.chart.series[0].userOptions.data;
    return data[this.pos].id
  }