javascript - Morris.js 条形图缺少标签

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

Morris 这样做是因为没有足够的空间放置标签。尝试为标签添加一个 Angular ，您应该能够再次看到它们。

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