javascript - Highcharts 中 TreeMap 中的选择更改

Question

jsfiddle 链接:click here

这里有两个问题需要解决:

问题 1: 单击 selection2 和 selection 3 工作正常，但单击 Selection1 并没有反射(reflect)更改。

问题 2: 为了为不同的选择返回不同的数据标签，我已经编写了代码，它似乎工作正常但在调试时我发现每次进行选择时，以下代码都会执行两次。

formatter: function () {
  if(value=="selection3"){
    return '<b>'+this.point.name + '<br/>'+ this.point.value + '%</b> ' 
  }else{
    return '<b>'+this.point.name + '<br/>'+ this.point.value + '</b> '
  }
},

我的问题是这个格式化程序函数是如何工作的，以及为什么 if 条件对每个选择执行两次。

感谢您的帮助。

Answer 1

根据问题 1:

正如@ewolden 提到的

Issue one is caused by selection1Data being set in the initialization, and updated by reference

要修复它，您可以使用 setData(data [, redraw] [, animation] [, updatePoints]) 方法将 updatePoints 设置为 来更新您的数据>false(对于所有系列更改)

$('#selection1').click(function() {
  value = "selection1";
  chart.series[0].setData(selection1Data, true, {}, false);
});

updatePoints (Default: true)

When the updated data is the same length as the existing data, points will be updated instead of replaced. This allows updating with animation and performs better. In this case, the original array is not passed by reference. Set false to prevent.

还使用 setData 比 update 更可取

.. **[update]** method is more performance expensive than some other utility methods like Highcharts.Series#setData or Highcharts.Series#setVisible.

---

根据第 2 期:

函数 formatter 将被提供的每个系列调用。在您的示例中，chart 包含两个系列，这就是为什么

... everytime a selection is made, following code is executed twice.