有没有办法通过dc.js中的id检索图表对象

时间:2017-11-28 09:22:39

标签: dc.js

我根据用户输入添加行图,附加所需的div元素,然后将rowchart添加到此元素,但是当我处理标签时,当我使用dc.rowChart时,我不知道如何检索此图表(“#rowchart_ “+ checkedValues [i]),它有效,但它会让我误解,关于dimisions,而且我也无法设置图表的重置链接。我的问题是: 是否有ant方法来检索图表对象?

感谢任何帮助!!!谢谢!

    for(var i = 0; i < checkedValues.length; i++){
    $(".rowCharts").append("<div id='rowchart_" + checkedValues[i] + "' class='col-sm-12 col-md-12 col-lg-5'></div>");
    dc.rowChart("#rowchart_" + checkedValues[i])
        .width(400)
        .height(300)
        .margins({ top: 20, left: 10, right: 10, bottom: 20 })
        .dimension(ndx.dimension(function (d) { return d[checkedValues[i]]; }))
        .group(ndx.dimension(function (d) { return d[checkedValues[i]]; }).group())
        // .label(function (d) { 
        //     if (dc.rowChart("#rowchart_" + checkedValues[i]).hasFilter() && !dc.rowChart("#rowchart_" + checkedValues[i]).hasFilter(d.key)) { 
        //         return d.key + '(0%)'; 
        //     }
        //     var label = d.key;
        //     if (all.value()) { 
        //         label += '(' + (d.value / all.value() * 100).toFixed(2) + '%)'; 
        //     }
        //     return label;
        //  })
        .title(function (d) { return d.value; })
        .on('filtered.monitor', chartFilteredCallback)
        .elasticX(true)
        .rowsCap(10)
        .ordering(function (d) { return -d.value })
        .xAxis().ticks(5);
}

1 个答案:

答案 0 :(得分:1)

我找到了答案。我制作了一个数组来存储图表。

 rowCharts = [];
for(var i = 0; i < checkedValues.length; i++){
    var chartId = "rowchart_" + checkedValues[i];
    $(".rowCharts").append("<div id='" + chartId + "' class='col-sm-12 col-md-12 col-lg-5'></div>");
    var chart = dc.rowChart("#" + chartId);
    var dimension = ndx.dimension(function (d) { return d[checkedValues[i]]; });
    var group = dimension.group();

    rowCharts.push(chart);

    chart
        .width(400)
        .height(300)
        .margins({ top: 20, left: 10, right: 10, bottom: 20 })
        .dimension(dimension)
        .group(group)
        .label(function (d) { 
            if (chart.hasFilter() && !chart.hasFilter(d.key)) { 
                return d.key + '(0%)'; 
            }
            var label = d.key;
            if (all.value()) { 
                label += '(' + (d.value / all.value() * 100).toFixed(2) + '%)'; 
            }
            return label;
         })
        .title(function (d) { return d.value; })
        .on('filtered.monitor', chartFilteredCallback)
        .elasticX(true)
        .rowsCap(10)
        .ordering(function (d) { return -d.value })
        .xAxis().ticks(5);            
        $("#" + chartId).html('<strong>' + checkedValues[i] + '</strong><span class="reset" style="display: none;">Selected: <span class="filter"></span></span><a class="reset" href="javascript:redrawAll(rowCharts[' + i + ']);" style="display: none;"> reset</a>');
}