nvd3多个图表共享相同的数据

Question

我正在尝试构建共享相同数据的2个垂直图表。所以我创建了一个refreshPrimary(top)和refreshStackedArea(bottom)，根据用户选择的选项，可以调用它来刷新图形。

我遇到的问题是，当我同时调用refreshPrimary和refreshStackedArea时，顶部图形不显示。如果我只refreshPrimary它显示它的图表确定。以下是刷新功能，HTML和图表绘制功能。

刷新功能：

// Add refresh function to lm_pareto context
function refreshPrimary() {
   //
   function refreshGraph() {

    console.log("DEBUG JS lm_pareto.refreshGraph entered");


    d3.selectAll("#lm_pareto svg > *").remove();

    d3.select('#lm_pareto svg')   
    .datum(lm_pareto.dataPrimary)         
    .call(chart);          

    //Update the chart when window resizes.
    nv.utils.windowResize(function() { chart.update() });
    return chart;
    }
   nv.addGraph(refreshGraph);
}


function refreshStackedArea() {
   function refreshGraph_SArea() {

    d3.selectAll("#lm_stackedArea svg > *").remove();

    d3.select('#lm_stackedArea svg')   
    .datum(lm_pareto.dataStackedArea)  
    .call(chart);          //Finally, render the chart!

    //Update the chart when window resizes.
    nv.utils.windowResize(function() { chart.update() });
    return chart;
}
nv.addGraph(refreshGraph_SArea);
}

HTML DIV＆＃39>

<div id="lm_pareto" class="lm_graph" style="border: 2px solid blue"></div>
<div id="lm_stackedArea" class="lm_graph" style="border: 2px solid blue"></div>

TOP CHART

 var chart;

nv.addGraph(function () {
chart = nv.models.stackedLineChart()
    .options({
    reduceXTicks: false
})
    .margin(margin)

// Get normalised data for chart
chart.lines1.forceY(0);
chart.lines2.forceY(0);

svg = d3.select("#lm_pareto")
    .append("svg");

// chart is a temp object of nv.addGraph... not able to pass back.
return chart;
});

BOTTOM CHART

var margin = {
    top: 50,
    right: 50,
    bottom: 50,
   left: 70
};
var chart;

nv.addGraph(function() {
chart = nv.models.stackedAreaChart()
            .margin(margin)
            .x(function(d) { return d[0] })  
            .y(function(d, x) { return d[1]; })   
            .useInteractiveGuideline(true)   
            .rightAlignYAxis(false)      //y-axis to the right side.
//          .transitionDuration(500)
            .showControls(false)       
            .clipEdge(true)
            .color(lm_pareto.ColorList);


chart.yAxis
  .tickFormat(d3.format(',.2f'));

svg = d3.select("#lm_stackedArea")
    .append("svg")

// OLD WAY
//svg.datum(lm_pareto.dataStackedArea)
//      .call(chart);
//
//nv.utils.windowResize(chart.update);

return chart;