highcharts图表组件错误集合分析

错误一:

错误描述:

Highcharts Error #10

Can't plot zero or subzero values on a logarithmic axis

This error occurs in the following situations:
If a zero or subzero data value is added to a logarithmic axis
If the minimum of a logarithimic axis is set to 0 or less
If the threshold is set to 0 or less

错误含义阐述:

出现这个问题的原因有一下几种可能:

1、当我们设置了坐标轴xAxis或者yAxis的type为“logarithmic”对数轴类型的情况下,series内的data数据内存在0或者小于0的数据,但是最新版本的highcharts.js已经更正了这个bug。

$(function () {
    $('#container').highcharts({
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        yAxis: {
            type: 'logarithmic'
        },
        
        series: [{
            data: [0,-20,3,5,555,6,8,9,4,6,1,2]        
        }]
    });
});

2、坐标轴设置了type为“ logarithmic”对数轴的情况下,还设置了坐标轴的min最小值<=0的情况,将会报出该错误,形如:

$(function () {
    $('#container').highcharts({
    
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        
        yAxis: {
            type: 'logarithmic',
            minorTickInterval: 'auto',
            min:0
        },
    
        series: [{
            data: [-1, 5, 3, 7, 40, 3]
        }]
    
    });
});
3、设置了图表数据的个数的上限值<=0,形如:

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'area'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },       
        plotOptions: {
            series: {
                threshold: -1
            }
        },        
        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
        }]
    });
});

但是目前的最新本版highcharts.js没有这个问题了的。

错误二:

错误描述:

Highcharts Error #12
Highcharts expects point configuration to be numbers or arrays in turbo mode

This error occurs if the series.data option contains object configurations and the number of points exceeds the turboThreshold. It can be fixed by either setting the turboThreshold option to a higher value, or changing your point configurations to numbers or arrays. See turboThreshold.

错误含义阐述:

这个错误的含义很明显,主要是由于数据点个数超出了默认设置plotOpions内设置的turboThreshold为1000的限制。解决办法就是讲这个数值设置更大或者设置为0表示不做限制。具体可见帖子:http://www.stepday.com/post/tie/?331

错误三:

错误描述:

Highcharts Error #13

Rendering div not found

This error occurs if the chart.renderTo option is misconfigured so that Highcharts is unable to find the HTML element to render the chart in.

错误含义阐述:

这个错误很明显就是我们在执行图表创建的时候没有找到容器,执行检查chart内所配置的renderTo属性值的为容器ID的容器是否存在,不存在则会出现这个错误。另外一种是通过:

$("#容器ID").highcharts({});
如果document内尚未存在"容器ID“为ID的标签,也会报出这个错误。

错误四:

错误描述:

Highcharts Error #14

String value sent to series.data, expected Number

This happens if you pass in a string as a data point, for example in a setup like this:

series: [{
	data: ["3", "5", "1", "6"]
}]
Highcharts expects the data values to be numbers. The most common reason for this is that data is parsed from CSV or from a XML source, and the implementer forgot to run parseFloat on the parsed value.

For performance reasons internal type casting is not performed, and only the first value is checked (since 2.3).

错误含义阐述:

主要是series内的data接收了字符串类型的数据,切记:series内的data数组是一个数据类型的数组,决不允许出现字符串类型的数据。如果你用ajax返回json数据赋值给series前最好确保数据位非字符串类型,有必要的情况下执行以下parseFloat(number)。

错误五:

错误描述:

Highcharts Error #15

Highcharts expects data to be sorted

This happens when you are trying to create a line series or a stock chart where the data is not sorted in ascending X order. For performance reasons, Highcharts does not sort the data, instead it is required that the implementer pre-sorts the data.

错误含义阐述:

这个错误似乎不存在的才对,非排序数据不会报出这个错误的才是。

错误六:

错误描述:

Highcharts Error #16

Highcharts already defined in the page

This error happens the second time Highcharts or Highstock is loaded in the same page, so the Highcharts namespace is already defined. Keep in mind that the Highcharts.Chart constructor and all features of Highcharts are included in Highstock, so if you are running Chart and StockChart in combination, you only need to load the highstock.js file.

错误含义阐述:

highcharts对象已经在当前页面内定义过了,重复定义就会报出这个错误。也就是可能重复引用了多次highcharts.js或者highstock.js,也或者两个js均引入。如果是如此请删除其中之一。

错误七:

错误描述:

Highcharts Error #17

The requested series type does not exist

This error happens when you are setting chart.type or series.type to a series type that isn't defined in Highcharts. A typical reason may be that your are missing the extension file where the series type is defined, for example in order to run an arearange series you need to load the highcharts-more.js file.

错误含义阐述:

当我们给chart的type或者series内的type指定图表类型的时候,类型名称不是highcharts所识别的,形如你要乱指定一个类型:

chart:{
   type:'baidu"
}
这样肯定是错误的,需要按照highcharts所设定的type类型集合来,比如:line、spline、column、bar、pie、scatter、ploar等。

错误八:

错误描述:

Highcharts Error #18

The requested axis does not exist

This error happens when you set a series' xAxis or yAxis property to point to an axis that does not exist.

错误含义阐述:

当我们在指定某个序列所属xAxis或者yAxis的时候,其角标超出了坐标轴的个数,形如下面的示例代码:

$(function () {
    $('#container').highcharts({
        chart: {
            marginRight: 80
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        yAxis: [{
            title: {
                text: 'Temperature'
            }
        }, {
            title: {
                text: 'Rainfall'
            },
            opposite: true
        }],
        
        series: [{
            type: 'line',
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
            name: 'Temperature',
            yAxis:4
        }, {
            type: 'column',
            data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4],
            name: 'Rainfall',
            yAxis: 3
        }]
    });
});

实例中只有两个Y轴,但是在series序列内所指定的所属某个yAxis的时候,数值超出了y轴个数-1。(减掉1是因为角标是从0开始的)

错误九:

错误描述:

Highcharts Error #19

Too many ticks

This error happens when you try to apply too many ticks to an axis, specifically when you add more ticks than the axis pixel length. In practice, it doesn't make sense to add ticks so densely that they can't be distinguished from each other. One cause of the error may be that you set a tickInterval that is too small for the data value range. In general, tickPixelInterval is a better option, as it will handle this automatically. Another case is if you try to set categories on a datetime axis, which will result in Highcharts trying to add one tick on every millisecond since 1970.

错误含义阐述:

坐标刻度过多,且有设置了刻度间隔,最后无法放置。

错误十:

错误描述:

Highcharts Error #20

Can't add object point configuration to a long data series

In Highstock, if you try to add a point using the object literal configuration syntax, it works only when the number of data points is below the series' turboThreshold. Instead of the object syntax, use the Array syntax.

错误含义阐述:

添加数据对象超出了数据上限阀值。

本文为原创型文章转载请尊重他人劳动成果并注明出处: http://www.stepday.com/topic/?917





  • 6
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值