1

我的数据系列点在萤火虫中看起来像这样:


l false 
r true  
x 1339214400000 //from a mysql datetime
y 0

如何定义我的 xaxis,以便它只显示尽可能多的标签而不重叠?

我已经尝试了 tickInterval、tickPixelInterval 和 dateTimeLabelFormats,但到目前为止没有任何效果。

目前我这样定义我的xaxis:


xAxis: { labels: { formatter: function() { var date = new Date(this.value);
return Highcharts.dateFormat('%b %d ', date); } }
}

谢谢

4

2 回答 2

0

这就是我所拥有的,它很丑但似乎有效,我希望避免这种事情......




function loadAreaChartForNewsletters(report) {

    var metric = $("#chartSelect :selected").text();
    $("#gaChartLabel").html(metric);
    $("#gaChartNote").html("");
    charts.area.showLoading();

    var start = new Date($("#gaFromDate").val());
    var end = new Date($("#gaToDate").val());
    postSynchronous({
        action  : "getAnalytics",
        report  : report,
        start   : start.strftime("%Y-%m-%d"),
        end     : end.strftime("%Y-%m-%d")
    }, function(data) {
        // Empty the current chart and load new data

        charts.area.hideLoading();
        destroyCharts("area");
        if (checkForErrors(data)) return;


        var pointsopens = data.pointsopens.data;
        var pointsclicks = data.pointsclicks.data;      

        var total = 0;
        var openstotal = 0;
        var clickstotal = 0;
        var length = 0;
        for (var i in pointsopens) openstotal += pointsopens[i].y; 

        for (var i in pointsclicks) clickstotal += pointsclicks[i].y;

        if  ( pointsopens.length > pointsclicks.length) length = pointsopens.length;
        else  length = pointsclicks.length;


        if  ( openstotal > clickstotal) total = openstotal;
        else total = clickstotal;


        $("#gaChartNote").html("Newsletter Open and Click events detected in " + timeDiffToStr(end-start));
        var numdays = Math.floor((end-start) / (1000*60*60*24));
        var days1 = Math.floor(numdays/8 );
        var days2 = Math.floor(numdays/8 )*2;
        var days3 = Math.floor(numdays/8 )*3;
        var days4 = Math.floor(numdays/8 )*4;
        var days5 = Math.floor(numdays/8 )*5;
        var days6 = Math.floor(numdays/8 )*6;
        var days7 = Math.floor(numdays/8 )*7;
        var days8 = Math.floor(numdays/8 )*8;
        var days9 = Math.floor(numdays/8 )*9;
        var days10 = Math.floor(numdays/8 )*10;
        var days11 = Math.floor(numdays/8 )*11;

        var currday=0;

        var plotLinesopen = createPlotlinesForNewsletters(pointsopens, '#AAAAAA');
        var plotLinesclick = createPlotlinesForNewsletters(pointsclicks, '#DDDDDD');
        config.pointIndex = null;
        config.areaPoints = new Array();
        config.areaPoints[0] = plotLinesopen;
        config.areaPoints[1] = plotLinesclick;
        var options = {
            chart : { renderTo : 'areaChart' },
            stacking: 'normal',
            title: {
                text: 'Open and Click events'
            },

            xAxis: {



                labels: {


                     formatter: function() {
                        var date = new Date(this.value);


                        if(numdays > 7){//show 8 dates on xaxis
                            currday++;
                            if(currday ==  days1  || 
                                currday ==  days2 || 
                                currday ==  days3 || 
                                currday ==  days4 || 
                                currday ==  days5 || 
                                currday ==  days6 ||  
                                currday ==  days7 ||
                                currday ==  days8 ||
                                currday ==  days9 ||
                                currday ==  days10 ||
                                currday ==  days11   ){ 

                                return Highcharts.dateFormat('%b %d ', date);
                            }
                            return '';
                        }else{

                            return Highcharts.dateFormat('%b %d ', date);
                        }
                    }  
                }



            },
            yAxis: {
                title: {
                    text: 'Newsletter Events'
                },
            },
            series : [ data.pointsopens, data.pointsclicks ]
        };
        if (length > 100) {
            options.plotOptions = {
                area : {
                    lineWidth: 1,
                    marker : { radius : 1 }

                }
            };
        }
        options = jQuery.extend(true, {}, areaChartDefault, options);

        charts.area = new Highcharts.Chart(options);
    });
}               

注释?我应该对这种无耻的黑客行为感到满意吗?

于 2012-07-09T17:07:52.330 回答
0

我认为下面的代码可以提供帮助

// iCount refers number of records, I am limiting total number of records to 10 here
if (iCount >= 10)
    iCount = (iCount + 10) / 10;

LineChart1.YAxis.Add(new YAxisItem { title = new Title("Values") });
LineChart1.XAxis.Add(new XAxisItem { tickInterval = iCount,
                                     title = new Title("Date"),
                                     categories = CopyString(0)
                                      .Where(c => c != null).ToArray() });
于 2012-07-23T16:48:32.707 回答