1

C# asp.net MVC アプリケーションを作成しました。コントローラーは下に表示されます。私は高チャートを使用しており、コントローラーから返されたものをチャートに入力したいと考えています。

以下に月と火の 2 つのフィールドがあり、コントローラーから返された値を表示するには、下の JavaScript にハードコードされた値を入力する必要があります。

注：コントローラーメソッドが機能するかどうかはわかりません:(（私は初心者です）が、コントローラーから返された値をチャートに入力する方法についてもっと心配しています。

私のC#コントローラー;

    public string timeHour()
    {
        var m = new MyModel();

        m.theTime = getAllTime(); // get all time

        return new JavaScriptSerializer().Serialize(m);
    }

ビューに表示されているハイチャート。

$(function () {
        $('#container').highcharts({
            chart: {
                type: 'areaspline'
            },
            title: {
                text: 'some title'
            },
            legend: {
                layout: 'vertical',
                align: 'left',
                verticalAlign: 'top',
                x: 150,
                y: 100,
                borderWidth: 1,
                backgroundColor: '#FFFFFF'
            },
            xAxis: {
                categories: [
                    'Mon',
                    'Tue'
                ],
                plotBands: [{ // visualize the weekend
                    from: 4.5,
                    to: 6.5,
                    color: 'rgba(68, 170, 213, .2)'
                }]
            },

            plotOptions: {
                areaspline: {
                    fillOpacity: 0.5
                }
            },
            series: [{
                name: 'John',
                data: [3, 4]
            }]
        });
    });
4

1 に答える 1

0

まず、コントローラーの戻り値の型を からstringに変更しますJsonResult。コントローラーが ActionResults を返すようにすることは、MVC スタイルの優れた規則であり、コードをもう少しわかりやすくします。

[HttpGet]
public JsonResult timeHour()
{
    var m = new MyModel();
    m.theTime = getAllTime(); // get all time
    return Json(m, JsonRequestBehavior.AllowGet)
}

私はそれGETとPOSTリクエストの両方がうまくいくはずだと信じています。冪等のようgetallTime()に見えるので (コードはここには示されていませんが)、GETリクエストが機能するように見えます。これは、jQuery で.get() メソッドを使用して実行できます。

$(function () {
    $.get("timeHour", null, function(result) {
        console.log("If the GET request is successful, the Controller will return the HighCharts data:");
        console.log(result);
    }, "json");
});

クライアントに返される JSON が Highcharts が好む形式であることを確認する必要があります。Controller が (AJAX GET 要求を介して) 正常に呼び出され、Highcharts データが返されたので、2 番目の質問に答えることができます。

コントローラーから返された値をチャートに入力する方法

...ハイチャートの「series.data」ドキュメント経由。MyModelこれを読めば、必要に応じてオブジェクトをどのように変更する必要があるかがわかると思います。

于 2015-02-03T15:02:55.480 に答える