データベースから日付と値のセットを取得するLinqクエリがあります。これを、JSONを使用してHighChartsチャートにプッシュできるようにする必要があります。
私がいつものlinqyのものに使用しているクエリはこれです:
var data = _db.CampaignValues.GroupBy(t => t.ValueDate)
.Select(g => new GraphValue() { T = g.Key, V = g.Sum(t => t.MessageCount) })
.OrderBy(g => g.T)
.Where(g => g.T > start)
.ToArray()
;
背景として、私はデータをHighChartsの「不規則な間隔の時間データ」チャートにプルしようとしています。それらの例に示されているデータ形式は次のとおりです。
data: [
[Date.UTC(1970, 9, 27), 0 ],
[Date.UTC(1970, 10, 10), 0.6 ],
[Date.UTC(1970, 10, 18), 0.7 ],
[Date.UTC(1970, 11, 2), 0.8 ]
]
私の問題は、これを上記に一致するJSON形式に変換できないように見えることです。引用された値を取得するか、配列が間違ったレイアウトになっています。
ビューでJsonConvertを使用してみましたが、現在、JSとLinqの知識に制限があります。
@model IQueryable<GatorWatch.Web.Controllers.GraphValue>
@{
var data = JsonConvert.SerializeObject(Model.ToList());
}
<script type="text/javascript">
var chart1;
$(document).ready(function() {
chart1 = new Highcharts.Chart({
//snip
series: [{
type: 'line',
name: 'Messages',
data: [@Html.Raw(data)]
}]
});
});
<script type="text/javascript">
しかし、それは次のような文字列を作成します:
data: [[
{"T":"2013-01-02T00:00:00","V":684112},
{"T":"2013-01-03T00:00:00","V":524172},
{"T":"2013-01-04T00:00:00","V":769807},
{"T":"2013-01-05T00:00:00","V":25076}
]]
別の方法は、 DotNet.Highchartsライブラリを使用することです。ライブラリによって示される例は、データが次の形式である場合です。
var data = new object[,]
{
{new DateTime(1970, 9, 27), 0},
{new DateTime(1970, 10, 10), 0.6},
{new DateTime(1970, 10, 18), 0.7},
{new DateTime(1970, 11, 2), 0.8},
}
これが私がアレックスの答えの助けを借りて思いついた解決策です。
コントローラ内:
private static long ToJavaScriptMilliseconds(DateTime dt)
{
long datetimeMinTimeTicks = (new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc)).Ticks;
return (long)((dt.ToUniversalTime().Ticks - datetimeMinTimeTicks) / 10000);
}
public ActionResult Index()
{
var v1 = _db.CampaignValues.GroupBy(t => t.ValueDate)
.Select(g => new GraphValue() { T = g.Key, V = g.Sum(t => t.MessageCount) })
.Where(g => g.T > start)
.OrderBy(g => g.T)
.AsEnumerable()
.Select(g => new object[] { ToJavaScriptMilliseconds(g.T), g.V })
.ToArray()
;
return View(v1);
}
次に、ビューで:
@model object[][]
// snip
series: [{
type: 'line',
name: 'Messages',
data: @Html.Raw(JsonConvert.SerializeObject(Model))
}]