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

Question

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

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

<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 является amChart собственный Data Loader плагин.

В основном вам просто нужно будет включить 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 
    }, 
}); 

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