Highcharts x軸類別重疊

日期在底部的x軸欄中重疊。解決這個問題的最佳解決方案是什麼？Highcharts x軸類別重疊

如果日期計數超過13，那麼我沒有任何類別標籤，但我至少需要鼠標懸停點上的日期。

我試過格式化函數，但它不起作用，它給了我數字而不是日期範圍。

xAxis: { 
     categories:{ 
      formatter: function() { 
       ['5/16/2013','7/1/2013','7/3/2013','7/2/2013','7/4/2013','7/6/2013','7/7/2013','7/8/2013','7/15/2013','5/22/2013','7/9/2013','7/10/2013','7/11/2013','7/13/2013'] 
      } 
     } 
},

我已經包括一個jsfiddle來向你展示它的外觀。

http://jsfiddle.net/8eTnE/

來源

2013-07-19 prospector

已修改了代碼，

 tickInterval : 2, 
     labels : { y : -15, rotation: -45, align: 'right' }

FIDDLE DEMO

只要檢查是可以接受的，你可以爲Y軸做同樣也是。只需使用標籤：{y：-15，旋轉：-45，align：'right'}值。你應該完成。

來源

2013-07-19 05:56:46

這裏你可以看到更好的輸出

http://jsfiddle.net/8eTnE/2/

中添加圖表，標籤，x軸爲

labels: { 
        rotation: -45, 
        align: 'right' 

       }

適當增加mmarginbottom 75爲

marginBottom: 75

這裏是完整的代碼

$(function() { 

     var curdateVar = "04/01/2013"; 
     var dateinreq = "04/01/2013"; 
     var csdataArr = null; 
     //var data = [0,0,0,0,0,0,0]; 
     var data1 = new Array(6); 
     var data2 = new Array(6); 


     var chart; 
     $(document).ready(function() { 
      chart = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'containermain', 
        type: 'line', 
        backgroundColor: { 
         linearGradient: [0, 0, 250, 500], 
         stops: [ 
                    [0, '#bbb'], 
                    [0.05, '#fff'], 
                    [1, 'white'] 
         ] 
        }, 
        borderColor: '#000000', 
        borderWidth: 2, 
        className: 'dark-container', 
        marginRight: 130, 
        marginBottom: 75 
       }, 
       title: { 
        text: 'Activity Stats', 
        x: -20 //center 
       }, 
       subtitle: { 
        text: 'Calories Burned', 
        x: -20 
       }, 
       xAxis: { 
        categories: ['5/16/2013','7/1/2013','7/3/2013','7/2/2013','7/4/2013','7/6/2013','7/7/2013','7/8/2013','7/15/2013','5/22/2013','7/9/2013','7/10/2013','7/11/2013','7/13/2013'] 
        ,labels: { 
       rotation: -45, 
       align: 'right' 

      } 
         }, 
         yAxis: { 
          title: { 
           text: 'Calories' 
          }, 
          min: 0, 
          max: 2000, 
          tickInterval: 50, 
          plotLines: [{ 
           value: 0, 
           width: 1, 
           color: '#808080' 
          }] 
         }, 
         tooltip: { 
          formatter: function() { 
           // return ''; 
           return '<b>' + this.series.name + '</b><br/>' + 
           this.x + ': ' + this.y + 'cals'; 
          } 
         }, 
         legend: { 
          layout: 'vertical', 
          align: 'right', 
          verticalAlign: 'top', 
          x: -10, 
          y: 100, 
          borderWidth: 0 
         }, 
         series: [{ 
          name: 'Activity', 
          data: [120  ,473  ,473  ,0   ,142  ,509  ,296  ,398  ,558  ,136  ,98  ,330  ,355  ,289  ] 
         /* data: data1]*/ 
        }] 
        }); 
       }); 

    });

指從Demo

來源

2013-07-19 06:05:58 Bhaarat

使用步驟選項更多格式，以克服在x軸

xAxis: { 
     categories:{ 
      formatter: function() { 
       ['5/16/2013','7/1/2013','7/3/2013','7/2/2013','7/4/2013','7/6/2013','7/7/2013','7/8/2013','7/15/2013','5/22/2013','7/9/2013','7/10/2013','7/11/2013','7/13/2013'] 
      } 
     }, 
     labels: { 
      **step: 2** 
     } 
    }

標籤重疊的問題

來源

2013-10-16 06:43:25 shammerw0w

Highcharts x軸類別重疊

回答

相關問題