weixin_33743661 2017-02-23 10:58 采纳率: 0%
浏览 30

Chartjs2图例不起作用

I'm trying to plot a lineal graphic that gets data from ajax using Chartjs 2.5.

This is the main function for this procedure. The main problem is that the legend doesn't appear.

function initDigitalValueChart(divName, ids) {
    if ($(divName)) {
        /*for (var j=0; j<ids.length; j++) {

                console.log(j);

                datasetValue[j] = {
                    fillColor: 'rgba(220,220,220,0.5)',
                    strokeColor :'rgba(220,220,220,1)',
                    title :'2013',
                    data : [Math.round(Math.random() * 1),Math.round(Math.random() * 1)]
                }
        }*/
        var datasetValue = [];
        var calls = [];
        for (var j = 0; j < ids.length; j++) {
            var labels = []
            URL = "*****" + ids[j];
            calls.push($.getJSON(URL, function(response) {
                var values = []
                if (response != null) {
                    $.each(response, function(index, data) {
                        labels.push(data["timestamp"]);
                        values.push(data["value"]);
                        title = data["sensorName"]
                    });
                    datasetValue.push({
                        label: title,
                        lineTension: 0,
                        borderColor: "rgba(" + Math.floor(Math.random() * 255) + ", " + Math.floor(Math.random() * 255) + ", " + Math.floor(Math.random() * 255) + ", 0.70)",
                        backgroundColor: "transparent",
                        data: values,
                        radius: 0,
                        pointHitRadius: 0,
                        steppedLine: true,
                    });
                }
            }))
        }
        $.when.apply($, calls).then(function() {
            var ctx = document.getElementById('digital').getContext("2d");
            var lineChart = new Chart(ctx, {
                type: 'line',
                data: {
                    labels: labels,
                    datasets: datasetValue
                },
                options: {
                    legend: {
                        display: true,
                        labels: {
                            fontColor: "white",
                            fontSize: 18
                        }
                    },
                    scales: {
                        xAxes: [{
                            display: true,
                            scaleLabel: {
                                display: true,
                                labelString: 'Data Hora'
                            }
                        }],
                        yAxes: [{
                            display: true,
                            scaleLabel: {
                                display: true,
                                labelString: 'Valor'
                            }
                        }]
                    }
                }
            });
            //document.getElementById('digital-legend').innerHTML = lineChart.generateLegend();
        });
    }
}

I tried to add the position: 'top' option but in this case the console returns

Uncaught TypeError: Cannot read property 'call' of undefined

Has anyone else had problems with this?

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 #MATLAB仿真#车辆换道路径规划
    • ¥15 java 操作 elasticsearch 8.1 实现 索引的重建
    • ¥15 数据可视化Python
    • ¥15 要给毕业设计添加扫码登录的功能!!有偿
    • ¥15 kafka 分区副本增加会导致消息丢失或者不可用吗?
    • ¥15 微信公众号自制会员卡没有收款渠道啊
    • ¥100 Jenkins自动化部署—悬赏100元
    • ¥15 关于#python#的问题:求帮写python代码
    • ¥20 MATLAB画图图形出现上下震荡的线条
    • ¥15 关于#windows#的问题:怎么用WIN 11系统的电脑 克隆WIN NT3.51-4.0系统的硬盘