0

我目前正在开发一个以图表模式显示流量使用情况的 Web 项目，并且我正在为该项目使用 Highchart Bar。问题是，当我运行这段代码时，它根本不会出错

 <script type="text/javascript">
    $(function () {
    $('#chart1').highcharts({
        chart: {
            type: 'column',
            margin: [ 50, 50, 100, 80]
        },
        title: {
            text: 'Sum of User'
        },
        xAxis: {
            categories: [
                'A','B','C','D',                ],
            labels: {
                rotation: -20,
                align: 'right',
                style: {
                    fontSize: '13px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total'
            }
        },
        legend: {
            enabled: false
        },
        tooltip: {
            formatter: function() {
                return '<b>'+ this.x +'</b><br/>'+
                    'User Values: '+ Highcharts.numberFormat(this.y, 1);
            }
        },
        series: [{
            name: 'sum',
            data: [
            3,5,1,1,                ],
            dataLabels: {
                enabled: true,
                rotation: 0,
                color: '#FFFFFF',
                align: 'center',
                x: 0,
                y: 17,
                style: {
                    fontSize: '14px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        }]
    });
});
</script>

但是当我将数据类别增加到 A、B、C、D、E、F 和 G 时，每个类别值分别为：2、1、1、17、1、43、6、5，脚本没有t 根本不显示任何图表。有任何想法吗？

4

2 回答 2

0

我不认为有什么问题。

 $(function () {
    $('#chart1').highcharts({
        chart: {
            type: 'column',
            margin: [ 50, 50, 100, 80]
        },
        title: {
            text: 'Sum of User'
        },
        xAxis: {
            categories: [
                'A','B','C','D','E','F','G'                ],
            labels: {
                rotation: -20,
                align: 'right',
                style: {
                    fontSize: '13px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total'
            }
        },
        legend: {
            enabled: false
        },
        tooltip: {
            formatter: function() {
                return '<b>'+ this.x +'</b><br/>'+
                    'User Values: '+ Highcharts.numberFormat(this.y, 1);
            }
        },
        series: [{
            name: 'sum',
            data: [
            2,1,1,17,1,43,6,               ],
            dataLabels: {
                enabled: true,
                rotation: 0,
                color: '#FFFFFF',
                align: 'center',
                x: 0,
                y: 17,
                style: {
                    fontSize: '14px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        }]
    });
});

测试小提琴

让我知道你的意见。

于 2013-07-19T04:55:23.313 回答
-1

请从小数据开始...

就像首先尝试显示A,B,C .. 然后.A,B,C,D .如果成功然后再添加一个E..

small steps然后检查该图表未显示的位置..

这样可以解决你的问题。

于 2013-07-19T06:18:10.437 回答