Question

使用折线图js。需要制作显示/隐藏数据集的复选框

我做了这样的事情：

RuntimeError: {:address=>"localhost", :port=>25, :domain=>"localhost.localdomain", :user_name=>nil, :password=>nil, :authentication=>nil, :enable_starttls_auto=>true, :openssl_verify_mode=>nil, :ssl=>nil, :tls=>nil, "address"=>"smtp.gmail.com", "port"=>587, "authentication"=>"plain", "user_name"=>"email", "password"=>"password", "enable_starttls_auto"=>true}
from /Users/KimJaeseong/.rbenv/versions/2.2.0/lib/ruby/gems/2.2.0/gems/mail-2.5.4/lib/mail/network/delivery_methods/smtp.rb:113:in `deliver!'
from /Users/KimJaeseong/.rbenv/versions/2.2.0/lib/ruby/gems/2.2.0/gems/mail-2.5.4/lib/mail/message.rb:2129:in `do_delivery'
from /Users/KimJaeseong/.rbenv/versions/2.2.0/lib/ruby/gems/2.2.0/gems/mail-2.5.4/lib/mail/message.rb:232:in `block in deliver'
...
...

其中dataSets是数据集对象的数组，当复选框改变时，我执行下一步：

lineChartData = {
                        labels : ["01.01.2015","012.01.2015","03.01.2015","04.01.2015","05.01.2015","06.01.2015","07.01.2015"],
                        datasets : dataSets
                    };

myNewChart.datasets [datasetId] = {};在图表上工作和删除行，但添加数据集不显示该行，但是它添加在myNewChart.datasets数组中。

Answer 1

只需破坏并重绘图表即可。虽然Chart.js支持添加和删除线点 - 它是按标签（而不是数据集 - 这是你想要的）

您的问题是您正在清空实际的数据集对象 - 如果您将其链接到数据集的副本，一切正常。

这是您更新的更改处理程序

$('input:checkbox').change(function () {
    var chartId = $(this).attr('data-chart-id');
    var datasetId = $(this).attr('data-data-set');

    dataSets[datasetId].hide = !$(this).prop('checked')

    lineChartData.datasets = []
    dataSets.forEach(function (dataset) {
        // create a copy of the dataset to modify (if required) and put into the chart dataset array
        var copy = jQuery.extend(true, {}, dataset)
        if (dataset.hide)
            copy.data = []
        lineChartData.datasets.push(copy)
    })

    // create the graph from scratch
    myNewChart.destroy()
    myNewChart = new Chart(ctx).Line(lineChartData, chartOpt);
});

小提琴 - http://jsfiddle.net/6qdm7nwu/

新数据不显示Chart js

1 个答案: