0
我正在使用amchart
來呈現帶有JSON數據的圖表,這是一個API響應數據, 及其完美工作。現在我必須根據選擇下拉菜單來更新數據,這些下拉菜單會使API調用請求獲得響應JSON,在獲取響應數據後也會執行此操作,我不知道如何使用更新amcharts中的amcharts數據
$scope.changeYearFunction = function(){
console.log($scope.selectedYear);
chartService.getDataByMonth($scope.selectedYear).then(function(response){
$scope.monthdata = response.data;
\t $scope.$apply();
})
}
$scope.monthChart = function(year){
chartService.getDataByMonth('2016').then(function(response){
$scope.monthdata = response.data;
\t $scope.finishloading = true;
\t console.log($scope.monthdata);
\t $scope.amChartOptions = {
\t \t data : $scope.monthdata,
\t \t type: "serial",
\t \t theme: "light",
\t \t marginRight: 80,
\t \t balloon: {
\t \t cornerRadius: 6,
\t \t horizontalPadding: 15,
\t \t verticalPadding: 10
\t \t },
\t \t chartScrollbar: {
\t \t enabled: true,
\t \t },
\t \t valueAxes: [{
\t \t gridAlpha: 0.5,
\t \t gridColor: '#dddddd',
\t \t }],
\t \t graphs: [{
\t \t bullet: 'square',
\t \t bulletBorderAlpha: 1,
\t \t bulletBorderThickness: 1,
\t \t fillAlphas: 0.5,
\t \t //fillColorsField: 'lineColor',
\t \t legendValueText: '[[value]]',
\t \t //lineColorField: 'lineColor',
\t \t title: 'power',
\t \t valueField: 'power'
\t \t }],
\t \t chartCursor: {
\t \t //categoryBalloonDateFormat: 'MMM',
\t \t cursorAlpha: 0,
\t \t fullWidth: true
\t \t },
\t \t //dataDateFormat: "MM",
\t \t categoryField: "month",
\t \t export: {
\t \t enabled: true
\t \t } \t \t
\t }
})
}();
<div class="panel-heading"><span>Monthly Consumption</span>
\t <select ng-model="selectedYear" ng-change="changeYearFunction()">
\t \t <option ng-repeat="x in year" value={{x}}>{{x}}</option>
\t </select>
</div>
<div class="panel-body">
\t <div style="height: 450px; width: 100%;">
\t \t <am-chart ng-if="finishloading" id="myAreaChart" options="amChartOptions"></am-chart>
\t </div>
</div>
沒有它不工作,說:「類型錯誤:無法設置屬性‘數據’的未定義」 –
是的,你需要有默認amchart配置。我更新了我的回答 – Leguest
對不起,延遲迴復,但謝謝你的修復,它的工作原理,但有一個問題,當我加載頁面沒有數據,然後當我選擇年份,然後只有圖表顯示數據... –