Динамические данные ASHX, просматриваемые в amCharts

Question

Я работаю с обработчиком данных.ashx, который успешно вызывает и возвращает допустимое форматирование JSON (подтверждено с помощью http://www.freeformatter.com/json-validator.html).

Я хочу использовать эти возвращенные данные в amChart. Моя диаграмма правильно работает с жестко закодированными данными. Как сделать так, чтобы диаграмма принимала динамические данные JSON Ashx?

<script type="text/javascript">
    var chart = AmCharts.makeChart("chartdiv", {
        "type": "serial",
        "theme": "light",
        "marginRight": 70,
        "dataProvider": [{
            "date": "11/04/2014",
            "val1": 125,
            "val2": 150
         }, {
            "date": "11/05/2014",
            "val1": 100,
            "val2": 130
         }, 
         // ETC
         ]
         "valueAxes": [{
             "axisAlpha": 0,
             "position": "left",
             "title": "Visitors By Date"
         }],
        "graphs": [{
            "id": "val1",
            "title": "val1bar",
            "valueField": "val1",
            "type": "column",
            "balloonText": "VAL1<br>[[date]]<br>[[val1]]</div>"
        }, {
            "id": "val2",
            "title": "val2bar",
            "valueField": "val2",
            "type": "column",
            "balloonText": "VAL1<br>[[date]]<br>[[val1]]</div>"
        }],       
        "chartCursor": {
            "pan": true,
            "valueLineEnabled": true,
            "valueLineBalloonEnabled": true,
            "cursorAlpha": 0,
            "valueLineAlpha": 0.2
        },
        "categoryField": "date",
        "categoryAxis": {
            "gridPosition": "start",
            "labelRotation": 45
        },
    });
</script>

Answer 1

Вероятно, самый простой способ использовать вывод JSON из ASHX - это собственный плагин Data Loader от amChart.

В основном вам просто нужно включить amcharts/plugins/dataloader/dataloader.min.jsзатем заменить dataProvider с dataLoader информация, как это:

var chart = AmCharts.makeChart( "chartdiv", {
  "type": "serial",
  "theme": "light",
  "marginRight": 70,
  "dataLoader": {
    "url": "mydata.ashx"
  },
  "valueAxes": [ {
    "axisAlpha": 0,
    "position": "left",
    "title": "Visitors By Date"
  } ],
  "graphs": [ {
    "id": "val1",
    "title": "val1bar",
    "valueField": "val1",
    "type": "column",
    "balloonText": "VAL1<br>[[date]]<br>[[val1]]</div>"
  }, {
    "id": "val2",
    "title": "val2bar",
    "valueField": "val2",
    "type": "column",
    "balloonText": "VAL1<br>[[date]]<br>[[val1]]</div>"
  } ],
  "chartCursor": {
    "pan": true,
    "valueLineEnabled": true,
    "valueLineBalloonEnabled": true,
    "cursorAlpha": 0,
    "valueLineAlpha": 0.2
  },
  "categoryField": "date",
  "categoryAxis": {
    "gridPosition": "start",
    "labelRotation": 45
  },
} );

Data Loader ожидает данные JSON по умолчанию, поэтому вам не нужно устанавливать какие-либо другие параметры.