Highcharts自定义错误处理程序

我们使用highcharts在一个HTML页面上绘制多个图表

然而，一个/一些图表抛出highchart错误，我们喜欢捕捉这些错误并向用户显示不同的错误。 为此，highcharts提供自定义错误处理程序。但此自定义错误处理程序不提供有关抛出该错误的特定图表的信息

这里是highcharts提供的JS Fiddle，适用于图表：

Highcharts.error = function (code, true) {
// See 
https://github.com/highcharts/highcharts/blob/master/errors/errors.xml
// for error id's
Highcharts.charts[0].renderer
    .text('Chart error ' + code)
    .attr({
        fill: 'red',
        zIndex: 20
    })
    .add()
    .align({
        align: 'center',
        verticalAlign: 'middle'
    }, null, 'plotBox');
};

你知道如何在每个图表中使用这个自定义错误处理程序吗？ 我正在使用new Highcharts.Charts（选项）创建新图表，但看不到为每个图表指定错误处理程序的方法

---

其他信息：通过API使用数据刷新/追加图表。配置图表的用户还配置用于图表的刷新间隔和查询

Highcharts错误函数未调整为将图表上下文作为参数，因为它也可以在不同的上下文中执行

例如：第二次在同一页面中加载Highcharts/Highstock时，会出现错误号16。它与图表无关，因为它只依赖于脚本导入

我找到的解决方法需要一些搜索和一些编码

请参阅此现场演示：

我在代码中找到了抛出错误10（您在示例中使用的错误）的位置。我重写了此函数（有关在Highcharts中覆盖的更多信息，请参见此文档页面），并添加了一个

图表

变量（来自

Highcharts.Axis.prototype.setTickInterval

范围）作为第三个参数：

  if (
    axis.positiveValuesOnly &&
    !secondPass &&
    Math.min(axis.min, pick(axis.dataMin, axis.min)) <= 0
  ) { // #978
    H.error(10, 1, chart); // Can't plot negative values on log axis // MODIFIED LINE
  }

---

您可以在图表构造函数选项中添加自己的属性，并在

chart.options

对象中找到它。

HighCharts中的错误处理没有多大意义。将图表实例传递给

Highcharts.error

（如Kamil Kulig所写）或在中包含

error

事件更有意义。无论如何 我想出了一个解决方案：

创建一个错误数组：

var chartErrors=[]；

创建一个错误处理程序，将错误推送到

chartErrors

。我正在创建的错误对象如下所示：

{“chartIndex:“errorCode:}

。所有图表在创建时都会添加到

Highcharts.charts

数组中，因此我们可以使用

Highcharts.charts.length-1

作为

图表索引

Highcharts.error=函数（代码）{
//看https://github.com/highcharts/highcharts/blob/master/errors/errors.xml
//对于错误id的
push（{“chartIndex”：Highcharts.charts.length-1，“errorCode”：code}）；
};

启动所有图表后，我们将有一系列错误。我们可以在此数组上调用
forEach
，并以我们想要的方式处理错误

chartErrors.forEach（函数（c）{
Highcharts.charts[c.chartIndex].渲染器
.text（'图表错误'+c.errorCode）
艾特先生({
填充：“红色”，
zIndex:20
})
.add（）
.对齐({
对齐：'居中'，
垂直排列：“中间”
}，null，'plotBox'）；
});

工作示例：
注意：我将代码包装在一个自调用函数中，以防止变量泄漏到全局范围


（函数（）{
var chartErrors=[]；
Highcharts.error=函数（代码）{
//看https://github.com/highcharts/highcharts/blob/master/errors/errors.xml
//对于错误id的
push（{“chartIndex”：Highcharts.charts.length-1，“errorCode”：code}）；
};
Highcharts.图表（'container1'{
标题：{
文本：“Highcharts错误处理演示”
},
xAxis：{
类别：[一月、二月、三月、四月、五月]
},
亚克斯：{
类型：'对数'，
最低：0
},
系列：[{
数据：[1,3,2]，
类型：“列”
}]
});
海图。海图（'container2'{
标题：{
正文：“2010-2016年太阳能行业就业增长”
},
副标题:{
文本：“来源：thesolarfoundation.com”
},
亚克斯：{
标题：{
文本：“员工人数”
}
},
图例：{
布局：“垂直”，
对齐：“右”，
垂直排列：“中间”
},
打印选项：{
系列：{
标签：{
允许的连接器：false
},
起点：2010年
}
},
系列：[{
名称：'安装'，
数据：[4394352503571776965897031119931137133154175]
}, {
名称：“制造业”，
数据：[24916、24064、29742、29851、32490、30282、38121、40434]
}, {
名称：“销售与分销”，
数据：[117441772216051977120185243773214739387]
}, {
名称：“项目开发”，
数据：[null，null，798812169151121522440034227]
}, {
名称：'其他'，
数据：[129085948810511248898918161827418111]
}],
响应：{
规则：[{
条件：{
最大宽度：500
},
图表选项：{
图例：{
布局：“水平”，
对齐：'居中'，
垂直排列：“底部”
}
}
}]
}
});
海图。海图（'container3'{
标题：{
文本：“Highcharts错误处理演示”
},
xAxis：{
类别：[一月、二月、三月、四月、五月]
},
亚克斯：{
类型：'对数'，
最低：0
},
系列：[{
数据：[1,3,2]，
类型：“列”
}]
});
forEach（函数（e）{
Highcharts.charts[e.chartIndex]。渲染器
.text（'图表错误'+e.errorCode）
艾特先生({
填充：“红色”，
zIndex:20
})
.add（）
.对齐({
对齐：'居中'，
垂直排列：“中间”
}，null，'plotBox'）；
}
Highcharts.error = function(code, stop, chart) {
  // See https://github.com/highcharts/highcharts/blob/master/errors/errors.xml
  // for error id's
  Highcharts.charts[0].renderer
    .text('Chart error ' + code + " on chart titled: " + chart.title.textStr)

    (...)