変数を amCharts.loadfile メソッドに渡しますか?

不明なコード

状況

ユーザーがドロップダウン リストで値を選択でき、データがグラフに読み込まれるグラフを作成しています。amCharts の Web サイトで同様の例を見つけました。https://www.amcharts.com/kbase/dynamically-loading-chart-datasets/

この例の問題は、データが「ハードコーディング」されているため、各オプションについて、事前に構築されたリンクである必要があることです。

私がやった事

これまでのところ、私はチャートを機能させ、渡された「アイテム」に応じて 3 つのステータスをカウントするコントローラーを作成しました。

ただし、私の item_name 変数は常に null です。

public ActionResult checkPriority(string item_name)
{
    decimal?[] priCount = { 0, 0, 0 };

    priCount[0] = db.vw_priCount.Where(i => i.itemDescrip == item_name&& i.itemStatus == 1).Count();
    priCount[1] = db.vw_priCount.Where(i => i.itemDescrip == item_name&& i.itemStatus == 2).Count();
    priCount[2] = db.vw_priCount.Where(i => i.itemDescrip == item_name&& i.itemStatus == 3).Count(); 


    return Json(priCount, JsonRequestBehavior.AllowGet);

}

これは私のインデックスページのコードです

 <script>



        var chart;


            $(document).ready(function () {

                $.ajax({
                    type: "POST",
                    url: '/Home/checkPriority',
                    data:{
                        item_name: "Pens"
                    },
                    dataType: "json",
                    success: OnSuccessBoxCountPri,
                    error: OnErrorCallPri
                });

            });

            function OnErrorCallPri(response) {
                alert('An error occured with the charts, please try again later.');
            }

            function OnSuccessBoxCountPri(priCount) {
                console.log(priCount);


                  chart = AmCharts.makeChart("pribarchartdiv", {
                    "type": "serial",
                    "theme": "none",
                    "marginRight": 70,
                    "dataProvider": [{
                        "Priority Level": "Low",
                        "cost": priCount[0],
                        "color": "#FF0F00"
                    }, {
                        "Priority Level": "Medium",
                        "cost": priCount[1],
                        "color": "#FF6600"
                    }, {
                        "Priority Level": "High",
                        "cost": priCount[2],
                        "color": "#FF9E01"
                    }, {
                        "Priority Level": "Very High",
                        "cost": priCount[3],
                        "color": "#04D215"


                    }],
                    "valueAxes": [{
                        "axisAlpha": 0,
                        "position": "left",
                        "title": "Priority"
                    }],
                    "startDuration": 1,
                    "graphs": [{
                        "balloonText": "<b>[[category]]: [[value]]</b>",
                        "fillColorsField": "color",
                        "fillAlphas": 0.9,
                        "lineAlpha": 0.2,
                        "type": "column",
                        "valueField": "cost"
                    }],
                    "chartCursor": {
                        "categoryBalloonEnabled": false,
                        "cursorAlpha": 0,
                        "zoomable": false
                    },
                    "categoryField": "Priority Level",
                    "categoryAxis": {
                        "gridPosition": "start",
                        "labelRotation": 45
                    },
                    "export": {
                        "enabled": true
                    }

                });



            }



            function setDataSet(dataset_url) {

                AmCharts.loadFile("checkPriority",{}, function (data) {
                    console.log(dataset_url);//itemname in here
                    console.log(data);//0,0,0
                    chart.dataProvider = AmCharts.parseJSON(data);
                chart.validateData();
            });
        }

    </script>
    <p class="selector">
        <select onchange="setDataSet(this.options[this.selectedIndex].value);">
            <option value="Pens">Data Set #1</option>
            <option value="Chalk">Data Set #2</option>
            <option value="Books">Data Set #3</option>
        </select> &lt; Select a data set
    </p>

これは、AmCharts.loadFile("checkPriority",{}, function (data) {変数 (チェックボックスの値) を渡す必要のある行だと思います。これを行う方法について、もしそれが可能かどうかについてのアドバイスは、ありがたいです。

xorspark

AmCharts.loadFileは、GET リクエストを実行する dataLoader プラグインによって提供される AJAX メソッドです。ドキュメント示されているように、最初のパラメーターはエンドポイントへの URL であるため、最初のパラメーターとして有効な URL を渡す必要があります。

エンドポイントはデータを取得するために POST を必要とするため、loadFile メソッドを使用する代わりに、独自の AJAX 呼び出しを使用することをお勧めします。例えば:

function setDataSet(dataset) {
  $.ajax({
    type: "POST",
    url: '/Home/checkPriority',
    data:{
      item_name: dataset
    },
    dataType: "json",
    success: function(data) {
      chart.dataProvider = data; 
      /* or if you need to set each element individually like in your makeChart call:
      chart.dataProvider = [{
        "Priority Level": "Low",
        "cost": data[0],
        "color": "#FF0F00"
      }, {
        "Priority Level": "Medium",
        "cost": data[1],
        "color": "#FF6600"
      }, {
        "Priority Level": "High",
        "cost": data[2],
        "color": "#FF9E01"
      }, {
        "Priority Level": "Very High",
        "cost": data[3],
        "color": "#04D215"
      }];
      */
      chart.validateData();
    },
    error: OnErrorCallPri
  });
}

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

変数を別のメソッドに渡しますか?

分類Dev

文字列変数からメソッド名を使用して関数にメソッドを渡します

分類Dev

CodeCeptionでテストメソッドから別のメソッドに変数を渡します

分類Dev

amCHARTSをRTLに変換する

分類Dev

Assembly.LoadFileは、実行可能場所の依存関係を確認します

分類Dev

ReactAudioPlayerからAmchartsスライダーにデータを渡しますか?

分類Dev

Assembly.LoadFile()の前にDLLからプロパティを読み取る方法

分類Dev

ブロックをAFNetworkingメソッドに渡しますか?

分類Dev

POSTメソッドを使用してjQuery変数をPHPに渡します

分類Dev

FormEventからbuildViewメソッドにconfig / optionsを渡します

分類Dev

Java-char変数をメソッドに渡し、ブール値を返しますか?

分類Dev

AmchartsのvalueAxisを動的に変更します

分類Dev

メソッド間で同じクラスの変数を渡しますか?

分類Dev

JavaはマップされたDTOメソッドに変数を渡しますか?

分類Dev

変数を異なるメソッドにどのように渡しますか

分類Dev

amChartsでreactJSを使用できますか

分類Dev

C#LoadFileは、.txt、.rtfの読み込み時に未処理の例外をスローします

分類Dev

AmChartsはcategoryFieldを非表示/削除します

分類Dev

更新されたグローバルクラス変数をあるメソッドから別のメソッドにどのように渡しますか?

分類Dev

チャートがロードされた後、javascriptで変数を更新します-amcharts

分類Dev

パブリックメソッドの呼び出しからプライベートメソッドにIAppアプリ変数を渡します

分類Dev

メソッドをパラメーターとしてメソッドに渡す方法はありますか?

分類Dev

Assembly.LoadFileとAssembly.GetTypesを偽造するにはどうすればよいですか?

分類Dev

kotlin-メソッド参照を関数に渡します

分類Dev

外部関数をクラスメソッドに渡します

分類Dev

静的メソッドの参照を関数に渡します

分類Dev

Javaは値をメソッド/関数に渡します

分類Dev

AmCharts-ChartScrollbarを下に配置しますか?

分類Dev

amchartsのタイトルの位置を変更します

Related 関連記事

  1. 1

    変数を別のメソッドに渡しますか?

  2. 2

    文字列変数からメソッド名を使用して関数にメソッドを渡します

  3. 3

    CodeCeptionでテストメソッドから別のメソッドに変数を渡します

  4. 4

    amCHARTSをRTLに変換する

  5. 5

    Assembly.LoadFileは、実行可能場所の依存関係を確認します

  6. 6

    ReactAudioPlayerからAmchartsスライダーにデータを渡しますか?

  7. 7

    Assembly.LoadFile()の前にDLLからプロパティを読み取る方法

  8. 8

    ブロックをAFNetworkingメソッドに渡しますか?

  9. 9

    POSTメソッドを使用してjQuery変数をPHPに渡します

  10. 10

    FormEventからbuildViewメソッドにconfig / optionsを渡します

  11. 11

    Java-char変数をメソッドに渡し、ブール値を返しますか?

  12. 12

    AmchartsのvalueAxisを動的に変更します

  13. 13

    メソッド間で同じクラスの変数を渡しますか?

  14. 14

    JavaはマップされたDTOメソッドに変数を渡しますか?

  15. 15

    変数を異なるメソッドにどのように渡しますか

  16. 16

    amChartsでreactJSを使用できますか

  17. 17

    C#LoadFileは、.txt、.rtfの読み込み時に未処理の例外をスローします

  18. 18

    AmChartsはcategoryFieldを非表示/削除します

  19. 19

    更新されたグローバルクラス変数をあるメソッドから別のメソッドにどのように渡しますか?

  20. 20

    チャートがロードされた後、javascriptで変数を更新します-amcharts

  21. 21

    パブリックメソッドの呼び出しからプライベートメソッドにIAppアプリ変数を渡します

  22. 22

    メソッドをパラメーターとしてメソッドに渡す方法はありますか?

  23. 23

    Assembly.LoadFileとAssembly.GetTypesを偽造するにはどうすればよいですか?

  24. 24

    kotlin-メソッド参照を関数に渡します

  25. 25

    外部関数をクラスメソッドに渡します

  26. 26

    静的メソッドの参照を関数に渡します

  27. 27

    Javaは値をメソッド/関数に渡します

  28. 28

    AmCharts-ChartScrollbarを下に配置しますか?

  29. 29

    amchartsのタイトルの位置を変更します

ホットタグ

アーカイブ