c# - 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 文档，您可以指定：

barWidth  : z

在 rendererOptions{} 部分。其中 z 表示条的宽度（以像素为单位）。如果在相同的轴值上有多个条，您还可以指定 barPadding 和 barMargin。