在弹出窗口中显示 nvd3 pieChart 时出现问题 window?
Problems while displaying nvd3 pieChart in a pop up window?
我正在弹出窗口中打开 nvd3 pieChart window。我这样创建弹出窗口 window:
function openPopup(html,pos,style) {
var newWindow = window.open('');
newWindow.document.write(html);
return newWindow;
}
function openChartPopup(chartID,chartTitle) {
divId = "div" + chartID;
html = "<p>"+chartTitle+"</p><div id= \""+divId+"\"><svg id=\""+chartID+"\"></svg></div>";
newWindow = openPopup(html,"_blank","");
return d3.select(newWindow.document.getElementById(chartID));
}
然后我使用以下代码创建一个饼图:
de_select = openChartPopup("test_chart","TEst Chart");
var chart = nv.models.pieChart()
.x(function(d) { return d.label })
.y(function(d) { return d.value })
.showLabels(true)
.growOnHover(true);
de_select.datum(exampleData());
de_select.style({"width":"400px", "height":"500px"});
de_select.transition().duration(350);
de_select.call(chart);
nv.addGraph(chart);
我在单击按钮时执行上面的代码,这会在弹出窗口中打开一个图表,但有时它显示不正确,看起来像这样:
当我切换标签并再次关注 pop window 时,它正确显示为:
但是,所有图表属性仍然无法正常工作,例如 "growOnHover",但是当我在普通 html 页面而不是弹出窗口中显示图表时,相同的代码可以正常工作,我猜跟popup有关window,是不是NVD3的问题,?谁能指出问题所在?
试试这个:
nv.utils.windowResize(chart.update);
这将在 window 调整大小时更新图表。在弹出 window.
的情况下可能会发生这种情况
我不确定你是如何打开弹出窗口的window。你可以使用
newWindow = window.open("",title, "width=400,height=500");
newWindow.document.write(html);
我正在弹出窗口中打开 nvd3 pieChart window。我这样创建弹出窗口 window:
function openPopup(html,pos,style) {
var newWindow = window.open('');
newWindow.document.write(html);
return newWindow;
}
function openChartPopup(chartID,chartTitle) {
divId = "div" + chartID;
html = "<p>"+chartTitle+"</p><div id= \""+divId+"\"><svg id=\""+chartID+"\"></svg></div>";
newWindow = openPopup(html,"_blank","");
return d3.select(newWindow.document.getElementById(chartID));
}
然后我使用以下代码创建一个饼图:
de_select = openChartPopup("test_chart","TEst Chart");
var chart = nv.models.pieChart()
.x(function(d) { return d.label })
.y(function(d) { return d.value })
.showLabels(true)
.growOnHover(true);
de_select.datum(exampleData());
de_select.style({"width":"400px", "height":"500px"});
de_select.transition().duration(350);
de_select.call(chart);
nv.addGraph(chart);
我在单击按钮时执行上面的代码,这会在弹出窗口中打开一个图表,但有时它显示不正确,看起来像这样:
当我切换标签并再次关注 pop window 时,它正确显示为:
但是,所有图表属性仍然无法正常工作,例如 "growOnHover",但是当我在普通 html 页面而不是弹出窗口中显示图表时,相同的代码可以正常工作,我猜跟popup有关window,是不是NVD3的问题,?谁能指出问题所在?
试试这个:
nv.utils.windowResize(chart.update);
这将在 window 调整大小时更新图表。在弹出 window.
的情况下可能会发生这种情况我不确定你是如何打开弹出窗口的window。你可以使用
newWindow = window.open("",title, "width=400,height=500");
newWindow.document.write(html);