Question

我将JSON结构中的值解析为Morris JS条形图。 JSON值通过Ajax加载。问题是只有每一秒的值都加载到x行（xkeys）中。

我的代码：

    <script>
    $( document ).ready(function() {
    $.ajax({
        url: "http://intra.site.com/_vti_bin/ListData.svc/ExchangeRates?$orderby=Modified%20desc",
        headers: { 'accept': 'application/json;odata=verbose', 'content-type': 'application/json;odata=verbose'},
        success: function(data){ 
                    var params = {
                        element: 'myfirstchart',
                        data: [],
                        xkey: 'year',
                        ykeys: ['value'],
                        barColors: ['#f46813'],
                        labels: ['Rate']
                                    };



                        data.d.results.forEach(function(element) {
                        var obj = { "year": element.ExchangeCross, "value": element.ApprovedRate }; 
                        params.data.push(obj);
                    });

                    Morris.Bar(params);

                                }  
            });
});
</script>

图表呈现正常，但缺少某些标签。我拍了一张截图。

有关如何解决此问题的任何建议？

Answer 1

莫里斯这样做是因为标签没有足够的空间。尝试为标签添加一个角度，然后你就可以再次看到它们了。

var params = {
    element: 'myfirstchart',
    data: [],
    xkey: 'year',
    ykeys: ['value'],
    barColors: ['#f46813'],
    labels: ['Rate'],
    xLabelAngle: 60,
};

Morris.js条形图缺少标签

1 个答案: