Я смог создать горизонтальную линейную графику с шапками, создав новую серию для каждого временного интервала в моем наборе данных.
Хотя это отражает внешний вид, который я собираюсь, мне интересно, является ли это самым эффективным способом достижения моей цели.
График строки jqPlot с разрывами
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>
Вот результат:
Любое понимание на более эффективный способ построения таких линий будет приветствоваться. Благодаря!
Я считаю, что ширина бара относится к ширине, если полоса, при вертикальной ориентации. –
Он будет производить более легкий бар (или более толстый) – AnthonyLeGovic