关于Highcharts的x轴密密麻麻的时间格式显示问题解决方法

来源:互联网 发布:windows 1.0 开源 编辑:程序博客网 时间:2024/04/28 06:25
把X轴改为这样 xAxis: {categories:obj.tdate,   //x轴显示格式['0000-00-00','0000-00-00','0000-00-00','0000-00-00','4','5']labels: {step:2,rotation: -25, align: 'right', style: { font: 'normal 13px Verdana, sans-serif'}}},


例子

function chart_line_basic(renderTo, categories, series, legendEnabled) {    this.renderTo = renderTo;    this.series = series;    this.categories = categories;    this.legendEnabled = legendEnabled;    this.step=0;    this.rotation=0;    if(categories.length>4)    {    this.step=2;    this.rotation=25;    }}chart_line_basic.prototype.formatterTooltip = function () { }chart_line_basic.prototype.showChart = function () {    var chart;    chart = new Highcharts.Chart({        chart: {            renderTo: this.renderTo,            type: 'line',//            marginRight: 130,//            marginBottom: 25        },        title: {            text: '',            x: -20 //center        },        subtitle: {            text: '',            x: -20        },        xAxis: {            labels:{            step:this.step,            rotation: this.rotation            },            categories: this.categories        },        yAxis: {            title: {                text: ''            },            plotLines: [{                value: 0,                width: 1,                color: '#808080'            }]        },        tooltip: {            formatter: this.formatterTooltip        },        legend: {            floating: true,            layout: 'vertical',            align: 'right',            verticalAlign: 'top',            x: -10,            y: 20,            borderWidth: 0,            enabled: this.legendEnabled        },        series: this.series    });};


 

    <script type="text/javascript">        $(function () {            var renderTo = "container_1";            //如果没有可以用NULL表示:空 ,而0表示从0开始            var series = [{ name: 'Tokyo', data: [7.0, 6.9, null, 14.5, 18.2, 21.5, 25.2, 26.5]}];            var categories = ['一周', '二周', '三周', '四周', '五周', '六周', '七周', '八周'];            var legendEnabled = true;            var _line_basic = new chart_line_basic(renderTo, categories, series, legendEnabled);            _line_basic.formatterTooltip = function () { return this.x + ': ' + this.y + '%'; }            _line_basic.showChart();        });    </script>


<div id="container_1" style="min-width: 400px; height: 400px; margin: 0 auto"></div>


原创粉丝点击