如何使用 vue-highcharts 在本地更改 Highcharts 对象配置

Question

我想知道是否有一种方法可以设置选项和本地内容，而不仅仅是全局。我使用以下插件安装：

Highcharts.Pointer.prototype.reset = function () {
    return undefined;
};
Vue.use(VueHighcharts, { Highcharts });

不幸的是，这意味着重置功能并非在所有页面的所有图表中都有效。有没有办法，如何仅为某些图表设置一些配置选项？

Answer 1

如果您修改原型，则更改始终是全局的，因为您只有一个Highcharts副本。

要使某些图表的内容正常工作，您可以包装修改后的函数并根据图表选项中设置的某些标志/函数/等进行处理。

例如：

Highcharts.wrap(Highcharts.Pointer.prototype, 'reset', function(p, allowMove, delay) {
  if (this.chart.options.chart.resetPointer === false) {
    console.log('modified')
    return undefined
  }
  return p.call(this, allowMove, delay)
})

如果在图表的选项中您没有将 resetPointer prop 显式设置为 false，则通常会调用函数，如下所示：

chart: {
  resetPointer: false
},

现场示例：https://jsfiddle.net/e2bo3L4r/