javascript - High-charts scroll bar not working - Stack Overflow

admin管理员组

文章数量:1291602

I want to display all the categories with enabled scroll bar but it doesn't work. I don't know where I am making a mistake. The corresponding fiddle is:

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },

        xAxis: {
            categories: ['ghdg', 'kndfkjl', 'ytryr', 'Bananas', 'pop', 'errte', 'oi',         'Oranges1', 'Bananas1', 'Carrots1', 'Appls2', 'Pears2', 'wosflsj', 'ertet', 'yuyu', 'Ales', 'ioi', 'opl', 'bcvcx', 'Carots', 'Apes1', 'opop', 'Oranges1', 'yuiiui', 'Carrots1', 'errt', 'oioi', 'ioo', 'Bananas2', 'bfhjf', 'Apples', 'xxcc', '6546', 'Bananas', '646', 'tyuyf', 'rtr', 'rty', 'opuuui', 'fghf', 'tyuy', 'err', 'rewporij', 'xcvgff', 'ee', 'bvnvb', 'bnn', 'kjhfkdg', 'tytryt', '2121', 'Apples1', 'xvx', 'iyyuy', 'bnbn', 'yuyu', 'fgs', 'Pears2', 'orwuepr', 'ppwppw', 'Crots2', 'Apes', '545', 'nmvh', '855963', '96489', 'iuio', '8998', 'ghtrf', 'nff', 'Cats1', 'Apes2', '2333', 'itrosfgn', 'Banas2', 'zasar', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', , 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', , 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            min: 6
        },
        scrollbar: {
            enabled: true
        },
        series: [{
            data: [3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2,   6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
        }]
    });
});

Thank you.

I want to display all the categories with enabled scroll bar but it doesn't work. I don't know where I am making a mistake. The corresponding fiddle is: http://jsfiddle/manraj/7racxxu0/3

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'bar'
        },

        xAxis: {
            categories: ['ghdg', 'kndfkjl', 'ytryr', 'Bananas', 'pop', 'errte', 'oi',         'Oranges1', 'Bananas1', 'Carrots1', 'Appls2', 'Pears2', 'wosflsj', 'ertet', 'yuyu', 'Ales', 'ioi', 'opl', 'bcvcx', 'Carots', 'Apes1', 'opop', 'Oranges1', 'yuiiui', 'Carrots1', 'errt', 'oioi', 'ioo', 'Bananas2', 'bfhjf', 'Apples', 'xxcc', '6546', 'Bananas', '646', 'tyuyf', 'rtr', 'rty', 'opuuui', 'fghf', 'tyuy', 'err', 'rewporij', 'xcvgff', 'ee', 'bvnvb', 'bnn', 'kjhfkdg', 'tytryt', '2121', 'Apples1', 'xvx', 'iyyuy', 'bnbn', 'yuyu', 'fgs', 'Pears2', 'orwuepr', 'ppwppw', 'Crots2', 'Apes', '545', 'nmvh', '855963', '96489', 'iuio', '8998', 'ghtrf', 'nff', 'Cats1', 'Apes2', '2333', 'itrosfgn', 'Banas2', 'zasar', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', , 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', , 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
            min: 6
        },
        scrollbar: {
            enabled: true
        },
        series: [{
            data: [3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2,   6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 3, 6, 1, 2, 6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6, 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
        }]
    });
});

Thank you.

• javascript
• jquery
• highcharts

Share Improve this question Follow edited Nov 19, 2014 at 6:48 Raein Hashemi 3,38444 gold badges2424 silver badges3333 bronze badges asked Nov 19, 2014 at 6:35 rakeeeerakeeee 1,07355 gold badges2020 silver badges4747 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

scrollBar is an Highstock feature only (another library by highsoft), as described here: http://www.highcharts./docs/chart-concepts/scrollbar

Check this out: http://jsfiddle/rd9k4va5/

Use this instead of <script src="http://code.highcharts./highcharts.js"></script>

<script type="text/javascript" src="http://code.highcharts./stock/highstock.js"></script>

If you are using Angular, use this import instead:

import * as Highcharts from 'highcharts/highstock';

本文标签： javascriptHighcharts scroll bar not workingStack Overflow