hicharts 加横向滚动条

参考:http://bbs.hcharts.cn/forum.php?mod=viewthread&tid=28&fromuid=2

滚动条问题解决

xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        max:5 //3.设置显示个数
    },

完整例子

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<title>highchars</title>
  <script src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
  <script src="http://cdn.hcharts.cn/highstock/highstock.js"></script>



</head>
<html>
<body>
<div id="container" style="height: 500px"></div>

<script>


$(function () {
        
        var chart = new Highcharts.Chart({

    chart: {
        renderTo: 'container',
                heigth:300,
        type: 'column' //2.设置图表类型
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        max:5 //3.设置显示个数
    },
    
   
    //4.设置滚动条可用
    scrollbar: {
        enabled: true
    },
        yAxis:[{
                
        },{
                opposite:true
        }],
    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,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:'测试1'
    },{
        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,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:'测试2',
                yAxis:1
    }]
});

});
</script>
</body>
</html>

效果图


展开阅读全文

没有更多推荐了,返回首页