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。