目前我正在使用带有 ColdFusion 的 highcharts。我想创建有断点的图表，但有错误说“ 变量NULL未定义。”。所以我想问是否可以让highcharts中的一个数据值为null？
下面是我的代码。总质量
<cfscript>
categories= ['Apples', 'Pears', 'Oranges', 'Bananas', 'Grapes', 'Plums', 'Strawberries', 'Raspberries'] ;
series= [{
'name': 'John',
'data': [0, 1, 4, 4, 5, 2, 3, 7]
}, {
'name': 'Jane',
'data': [1, 0, 3, null, 3, 1, 2, 1]
}];
</cfscript>
<html>
<head>
<script src="jquery.min.js"></script>
<script src="highcharts.js"></script>
<script src="exporting.js"></script>
<script src="highcharts-more.js"></script>
<script>
$(function () {
$('#container').highcharts({
chart: {
type: 'area',
spacingBottom: 30
},
title: {
text: 'Fruit consumption *'
},
subtitle: {
text: '* Jane\'s banana consumption is unknown',
floating: true,
align: 'right',
verticalAlign: 'bottom',
y: 15
},
legend: {
layout: 'vertical',
align: 'left',
verticalAlign: 'top',
x: 150,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
xAxis: {
categories: <cfoutput>#serializeJson(categories)#</cfoutput>
},
yAxis: {
title: {
text: 'Y-Axis'
},
labels: {
formatter: function () {
return this.value;
}
}
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
this.x + ': ' + this.y;
}
},
plotOptions: {
area: {
fillOpacity: 0.5
}
},
credits: {
enabled: false
},
series: <cfoutput>#serializeJson(series)#</cfoutput>
});
});
</script>
</head>
<body>
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>
</body>
</html>最佳答案
highcharts 中的数据值可以为空。空值被视为缺失值。以下代码片段是删除了 ColdFusion 脚本的代码。
$(function () {
$('#container').highcharts({
chart: {
type: 'area',
spacingBottom: 30
},
title: {
text: 'Fruit consumption *'
},
subtitle: {
text: '* Jane\'s banana consumption is unknown',
floating: true,
align: 'right',
verticalAlign: 'bottom',
y: 15
},
legend: {
layout: 'vertical',
align: 'left',
verticalAlign: 'top',
x: 150,
y: 100,
floating: true,
borderWidth: 1,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
xAxis: {
categories: ['Apples', 'Pears', 'Oranges', 'Bananas', 'Grapes', 'Plums', 'Strawberries', 'Raspberries']
},
yAxis: {
title: {
text: 'Y-Axis'
},
labels: {
formatter: function () {
return this.value;
}
}
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
this.x + ': ' + this.y;
}
},
plotOptions: {
area: {
fillOpacity: 0.5
}
},
credits: {
enabled: false
},
series: [{
'name': 'John',
'data': [0, 1, 4, 4, 5, 2, 3, 7]
}, {
'name': 'Jane',
'data': [1, 0, 3, null, 3, 1, 2, 1]
}]
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>您遇到的错误表明 ColdFusion 脚本正在将 NULL(而不是 null)插入到 JavaScript 代码中。 JavaScript 区分大小写。 JavaScript 会假设 NULL 是变量的名称。由于从未声明名为 NULL 的变量，因此会导致一条错误消息，指示 NULL 未定义。
我不了解 ColdFusion，所以我无法帮助您修复 ColdFusion 脚本。
关于javascript - 我可以在 highcharts 中让数据值为空吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36191715/