我设置了一种方法,可以在我的网页上放大小图表,方法是取消隐藏页面' overlay' div并在其中创建一个次要的,更大的图表,其中的数据与点击的图表相同。
function DrawSmallChart() {
chart_data = [1, 2, 3, 4, 5];
LargeChartOptions = {
series: [{
name: 'Data',
data: chart_data
}],
};
SmallChartOptions = {
series: [{
name: 'Data',
data: chart_data
}],
events: {
click = function (e) { DrawLargeChart(LargeChartOptions); }
}
};
$('#smallchart-div-container').highcharts(SmallChartOptions);
}
function DrawLargeChart(options) {
chart_container_div = document.getElementById("graph-div-id");
chart_container_div.style.display = ""
$('#graph-div-id').off();
$("#graph-overlay-graph").highcharts('StockChart', options);
}
当我点击按钮时,我有另一个隐藏此div的功能。
我第一次点击页面加载时的小图表,大图表显示所有数据都很好。第二次单击它时,图表显示但没有数据。
我已经使用调试器来浏览正在发生的事情并且我已经确切地发现了问题所在,但我无法弄清楚如何解决它。
我第一次点击图表时,DrawLargeChart
函数会被options.series = <Array containing my series object with chart_data>
调用。第二次使用DrawLargeChart
调用options.series = null
。
当我刷新页面时,它是相同的 - 首次点击工作,后续点击不是。我怀疑它与chart_data
变量...
非常感谢任何帮助
经过一些调试后,很明显传递给options
的{{1}}对象在第一次点击时与后续点击次数不同。我的代码中没有任何内容正在更改DrawLargeChart()
结构
我发现这是传递值/传递引用错误。 LargeChartOptions
通过引用传入,第一次单击后不再存在。有没有办法按值传递它?我宁愿不必输入LargeChartOptions
(比我在这里输入的要大得多)到函数参数中,以防我将来更改任何内容
我弄清楚问题是什么。 LargeChartOptions
函数实际修改选项对象并设置$(target).highcharts(options)
我修改了options.series = null
函数,使用DrawLargeChart
options
的本地副本
options_buffer = $.extend(true,{},options);
通过创建function DrawLargeChart(options) {
chart_container_div = document.getElementById("graph-div-id");
options_buffer = $(target).highcharts(options);
chart_container_div.style.display = ""
$('#graph-div-id').off();
$("#graph-overlay-graph").highcharts('StockChart', options_buffer);
}
,highcharts函数无法修改options_buffer
(因为LargeChartOptions
只是对该变量的引用 - yay Javascript)
答案 0 :(得分:1)
我找到答案(原帖但在此复制):
我修改了DrawLargeChart
函数,使用options_buffer = $.extend(true,{},options);
function DrawLargeChart(options) {
chart_container_div = document.getElementById("graph-div-id");
options_buffer = $(target).highcharts(options);
chart_container_div.style.display = ""
$('#graph-div-id').off();
$("#graph-overlay-graph").highcharts('StockChart', options_buffer);
}
通过创建options_buffer
,highcharts函数无法修改LargeChartOptions
(因为options
只是对该变量的引用 - yay Javascript)