Question

目前我正在使用ColdFusion的高级图表。我想创建有突破点的图表，但有错误说“ 变量NULL未定义。“。所以我想问一下，我是否可以让highcharts中的一个数据值为null？

以下是我的代码。 TQ

<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>

Answer 1

高图中的数据值可以为null。空值被视为缺失值。以下代码段是删除了ColdFusion脚本的代码。

＆＃13;

$(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]
        }]
    });
});

＆＃13;

<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>

＆＃13;

您遇到的错误表明ColdFusion脚本在JavaScript代码中插入NULL（而不是null）。 JavaScript区分大小写。 JavaScript会假设NULL是变量的名称。由于从未声明了一个名为NULL的变量，因此会产生一条错误消息，指出NULL未定义。

我不知道ColdFusion，所以我无法帮你修复ColdFusion脚本。

我可以在highcharts中让数据值为null吗？

1 个答案: