jqPlot帶有間隙的折線圖

Question

我已經能夠通過爲我的數據集中的每個時間跨度創建一個新的系列來創建帶有大寫的水平線圖。

儘管這反映了我的目光，但我想知道這是否是實現我目標的最有效方式。

public class PlayerSession 
{ 
    public string PlayerSessionId { get; set; } 
    public string PlayerName { get; set; } 
    public DateTime LoginDateTime { get; set; } 
    public DateTime LogoutDateTime { get; set; } 
} 

@model List<PlayerSession> 
@{ 
    List<List<List<string>>> series = new List<List<List<string>>>(); 
    foreach(PlayerSession playerSession in this.Model) 
    { 
     series.Add(new List<List<string>> { 
      new List<string> { 
       playerSession.LoginDateTime.ToString(), 
       playerSession.PlayerName     
      }, 
      new List<string> { 
       playerSession.LogoutDateTime.ToString(), 
       playerSession.PlayerName     
      } 
     });  
    } 
} 
<div id="player-session-graph"></div> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $.jqplot('player-session-graph', @Html.Raw(Json.Encode(series)),{ 
      seriesDefaults: { 
       showMarker: false, 
       color: '#446C32', 
       lineWidth: 10, 
       lineCap: 'butt' 
      }, 
      axes: { 
       yaxis: { renderer: $.jqplot.CategoryAxisRenderer }, 
       xaxis: { 
        renderer: $.jqplot.DateAxisRenderer, 
        tickOptions: { 
         formatString: "%a, %b %e, %Y", angle: -30 
        }, 
        min: '2013-05-19', 
        max: '2013-05-25', 
        tickInterval: '1 day' 
       } 
      } 
     }); 
    }); 
</script> 

下面是結果：

上更有效的方式來繪製這些行任何有識之士將受到歡迎。謝謝！

Answer 1

據jqPlot documentation about bar charts，您可以指定：

barWidth : z 

在rendererOptions {}部分。其中z代表像素寬度。如果在同一個座標軸上有多個小節，您也可以指定barPadding和barMargin。