Javascript 在窗口函数中定义的窗口变量在外部看不到
我在window函数中定义了一个新的CanvasJS对象实例作为window，并将其称为chart。在管理滑块移动的函数中看不到此对象。其作用范围是随着滑块的移动，在图表中连贯地移动一条水平线。这是密码Javascript 在窗口函数中定义的窗口变量在外部看不到,javascript,global-variables,canvasjs,Javascript,Global Variables,Canvasjs,我在window函数中定义了一个新的CanvasJS对象实例作为window，并将其称为chart。在管理滑块移动的函数中看不到此对象。其作用范围是随着滑块的移动，在图表中连贯地移动一条水平线。这是密码 ajax截取回发并 A.用生成的html代码和脚本填充容器 B使用函数创建新图表 $("#desktop_new_alarm_research").submit(function(e) { e.preventDefault(); // avoid to execute the actual s
$("#desktop_new_alarm_research").submit(function(e) {
e.preventDefault(); // avoid to execute the actual submit of the form.
var form = $(this);
var url = ajax_url+'Login/getResearchResultsForNewPriceAlarms';
$.ajax({
type: "POST",
url: url,
data: form.serialize(), // serializes the form's elements.
success: function(data)
{
var response = JSON.parse(data);
$('#research_results_container').html(response.rendered_page);
if(response.state == 'success'){
if(response.galenic_made == false){
renderPriceGraphs(response.chart_name, response.min_price_usd, response.max_price_usd,response.factory_made,response.galenic_made,response.factory_made_max_min_graph_prices,response.factory_made_avg_graph_prices_stats);
}
if(response.galenic_made == true){
renderPriceGraphs(response.chart_name, response.min_price_usd,response.max_price_usd,response.factory_made,response.galenic_made,response.factory_made_max_min_graph_prices,response.factory_made_avg_graph_prices_stats,response.galenic_made_max_min_graph_prices,response.galenic_made_avg_graph_prices_stats);
}
}
}
});
});
//范围滑块代码
var slider=document.getElementById（“myRange”）；
var输出=document.getElementById（“演示”）；
output.innerHTML=
parseFloat（slider.value）.toPrecision（2）；/。精度（-）
数学地板（数学log10（滑块值））+2）；
slider.oninput=函数（）{
var min_slider_value=parseFloat（this.value）；
output.innerHTML=min\u slider\u value.toPrecision（2）；
chart.axisY[0]。带状线[0]。设置（“值”，最小值）；
//console.log（“TEST”+response.state）；
};
var slider1=document.getElementById（“myRange1”）；
var output1=document.getElementById（“demo1”）；
output1.innerHTML=
parseFloat（slider1.value）.toPrecision（2）；/。精度（-）
数学地板（数学log10（滑块值））+2）；
slider1.oninput=函数（）{
var max_slider_value=parseFloat（这个.value）；
output1.innerHTML=max\u slider\u value.toPrecision（2）；
};
window.renderPriceGraphs = function(chart_name, min_price_usd,
max_price_usd, factory_made, galenic_made,
factory_made_max_min_graph_prices,
factory_made_avg_graph_prices_stats,
galenic_made_max_min_graph_prices = null,
galenic_made_avg_graph_prices_stats = null) {
var max_line = max_price_usd*1.05;
var min_line = min_price_usd*0.90;
//alert("values "+max_price_usd+" "+min_price_usd);
console.log("values ma and min"+max_line+" "+min_line);
if(factory_made == true && galenic_made == true){
//var chart = new CanvasJS.Chart(chart_name, {
window.chart = new CanvasJS.Chart(chart_name, {
animationEnabled: true,
zoomEnabled:true,
theme: "light2",
title:{
text: "Prices per unit of main active ingredients"
},
// subtitles: [{
// text: "High and Low Prices - 2016"
// }],
axisX: {
valueFormatString: "MMM",
intervalType: "month",
interval: 1
},
axisY: {
title: "Price (in USD)",
prefix: "$",
interval: 0.010,
includeZero: false,
stripLines:[
{
value: max_line,
color:"#ff0000",
label: "Max threshold",
labelFontColor: "#ff0000",
showOnTop: true
},
{
value: min_line,
color:"#00bc00",
label: "Min threshold",
labelFontColor: "#00bc00",
showOnTop: true
}
]
},
data: [
{
type: "rangeSplineArea",
showInLegend: true,
legendText: "Factory made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Factory made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: factory_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Factory Prices",
legendMarkerColor: "#dee0ec",
color: "#dee0ec",
lineColor: "#dee0ec",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Factory made - <b>{x}</b> </br> Avg: {y}",
dataPoints: factory_made_avg_graph_prices_stats
},
{
type: "rangeSplineArea",
showInLegend: true,
color: "#51bfc3",
fillOpacity: .3,
legendText: "Galenic made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Galenic made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: galenic_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Galenic Prices",
legendMarkerColor: "#a6e6e8",
color: "#a6e6e8",
lineColor: "#a6e6e8",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Galenic made - <b>{x}</b> </br> Avg: {y}",
dataPoints: galenic_made_avg_graph_prices_stats
},
]
});
}
if(factory_made == true && galenic_made != true){
var chart = new CanvasJS.Chart(chart_name, {
animationEnabled: true,
zoomEnabled:true,
theme: "light2",
title:{
text: "Prices per unit of main active ingredients"
},
// subtitles: [{
// text: "High and Low Prices - 2016"
// }],
axisX: {
valueFormatString: "MMM",
intervalType: "month",
interval: 1
},
axisY: {
title: "Price (in USD)",
prefix: "$",
interval: 0.010,
includeZero: false,
stripLines:[
{
value: max_line,
color:"#ff0000",
label: "Max threshold",
labelFontColor: "#ff0000",
showOnTop: true
},
{
value: min_line,
color:"#00bc00",
label: "Min threshold",
labelFontColor: "#4b4b4b",
showOnTop: true
}
]
},
data: [
{
type: "rangeSplineArea",
showInLegend: true,
legendText: "Factory made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Factory made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: factory_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Factory Prices",
legendMarkerColor: "#dee0ec",
color: "#dee0ec",
lineColor: "#dee0ec",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Factory made - <b>{x}</b> </br> Avg: {y}",
dataPoints: factory_made_avg_graph_prices_stats
},
]
});
}
chart.render();
};
window.renderPriceGraphs=函数（图表名称、最低价格、美元、，
最高价格（美元）、工厂制造、galenic制造、，
工厂制造的最大最小图形价格，
工厂制造的平均价格图表价格统计数据，
galenic_made_max_min_graph_prices=null，
galenic_made_avg_graph_prices_stats=null）{
var max_line=最大价格_usd*1.05；
var最小线=最小价格×美元*0.90；
//警报（“值”+最高价格+最低价格+美元）；
console.log（“值ma和min”+最大线+“”+最小线）；
如果（工厂制造==true&&galenic制造==true）{
//var chart=新建CanvasJS.chart（图表名称{
window.chart=新建CanvasJS.chart（图表名称{
animationEnabled：没错，
可缩放：对，
主题：“light2”，
标题：{
正文：“每单位主要活性成分的价格”
},
//字幕：[{
//正文：“价格高低-2016”
// }],
axisX：{
valueFormatString:“嗯”，
间隔类型：“月”，
间隔时间：1
},
axisY：{
标题：“价格（美元）”，
前缀：“$”，
间隔：0.010，
包括：错，
带状线：[
{
值：最大值线，
颜色：“ff0000”，
标签：“最大阈值”，
labelFontColor:#ff0000“，
showOnTop：对
},
{
值：最小线，
颜色：“00bc00”，
标签：“最小阈值”，
labelFontColor:#00bc00“，
showOnTop：对
}
]
},
数据：[
{
类型：“rangeSplineArea”，
showInLegend：是的，
legendText：“工厂制造的最高/最低价格”，
xValueType:“日期时间”，
xValueFormatString：“DD MMM”，
yValueFormatString:“$”、“$”、“$”0.“，”，
toolTipContent:“工厂制造-{x}
Max:{y[1]}
Min:{y[0]}”，
数据点：工厂制造的最大最小图形价格
},
{
类型：“样条曲线”，
showInLegend：是的，
legendText：“平均出厂价格”，
legendMarkerColor:“dee0ec”，
颜色：“dee0ec”，
线条颜色：“dee0ec”，
markerSize:5，
xValueFormatString：“DD MMMM”，
yValueFormatString:“$#，###0.####”，
xValueType:“日期时间”，
ToolTicContent:“工厂制造-{x}平均值：{y}”，
数据点：工厂、制造、平均图、价格、统计数据
},
{
类型：“rangeSplineArea”，
showInLegend：是的，
颜色：“51bfc3”，
不透明度：.3，
legendText:“Galenic制造的最高/最低价格”，
xValueType:“日期时间”，
xValueFormatString：“DD MMM”，
yValueFormatString:“$”、“$”、“$”0.“，”，
ToolTicContent:“Galenic制造-{x}
Max:{y[1]}
Min:{y[0]}”，
数据点：galenic\u制造的\u最大值\u最小值\u图形\u价格
},
{
类型：“样条曲线”，
showInLegend：是的，
legendText:“Galenic平均价格”，
legendMarkerColor:#a6e6e8“，
颜色：“a6e6e8”，
线条颜色：“a6e6e8”，
markerSize:5，
xValueFormatString：“DD MMMM”，
yValueFormatString:“$#，###0.####”，
xValueType:“日期时间”，
ToolTicContent:“Galenic制造-{x}平均值：{y}”，
数据点：galenic\u Make\u avg\u graph\u prices\u stats
},
window.renderPriceGraphs = function(chart_name, min_price_usd,
max_price_usd, factory_made, galenic_made,
factory_made_max_min_graph_prices,
factory_made_avg_graph_prices_stats,
galenic_made_max_min_graph_prices = null,
galenic_made_avg_graph_prices_stats = null) {
var max_line = max_price_usd*1.05;
var min_line = min_price_usd*0.90;
//alert("values "+max_price_usd+" "+min_price_usd);
console.log("values ma and min"+max_line+" "+min_line);
if(factory_made == true && galenic_made == true){
//var chart = new CanvasJS.Chart(chart_name, {
window.chart = new CanvasJS.Chart(chart_name, {
animationEnabled: true,
zoomEnabled:true,
theme: "light2",
title:{
text: "Prices per unit of main active ingredients"
},
// subtitles: [{
// text: "High and Low Prices - 2016"
// }],
axisX: {
valueFormatString: "MMM",
intervalType: "month",
interval: 1
},
axisY: {
title: "Price (in USD)",
prefix: "$",
interval: 0.010,
includeZero: false,
stripLines:[
{
value: max_line,
color:"#ff0000",
label: "Max threshold",
labelFontColor: "#ff0000",
showOnTop: true
},
{
value: min_line,
color:"#00bc00",
label: "Min threshold",
labelFontColor: "#00bc00",
showOnTop: true
}
]
},
data: [
{
type: "rangeSplineArea",
showInLegend: true,
legendText: "Factory made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Factory made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: factory_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Factory Prices",
legendMarkerColor: "#dee0ec",
color: "#dee0ec",
lineColor: "#dee0ec",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Factory made - <b>{x}</b> </br> Avg: {y}",
dataPoints: factory_made_avg_graph_prices_stats
},
{
type: "rangeSplineArea",
showInLegend: true,
color: "#51bfc3",
fillOpacity: .3,
legendText: "Galenic made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Galenic made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: galenic_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Galenic Prices",
legendMarkerColor: "#a6e6e8",
color: "#a6e6e8",
lineColor: "#a6e6e8",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Galenic made - <b>{x}</b> </br> Avg: {y}",
dataPoints: galenic_made_avg_graph_prices_stats
},
]
});
}
if(factory_made == true && galenic_made != true){
var chart = new CanvasJS.Chart(chart_name, {
animationEnabled: true,
zoomEnabled:true,
theme: "light2",
title:{
text: "Prices per unit of main active ingredients"
},
// subtitles: [{
// text: "High and Low Prices - 2016"
// }],
axisX: {
valueFormatString: "MMM",
intervalType: "month",
interval: 1
},
axisY: {
title: "Price (in USD)",
prefix: "$",
interval: 0.010,
includeZero: false,
stripLines:[
{
value: max_line,
color:"#ff0000",
label: "Max threshold",
labelFontColor: "#ff0000",
showOnTop: true
},
{
value: min_line,
color:"#00bc00",
label: "Min threshold",
labelFontColor: "#4b4b4b",
showOnTop: true
}
]
},
data: [
{
type: "rangeSplineArea",
showInLegend: true,
legendText: "Factory made max/min Prices",
xValueType: "dateTime",
xValueFormatString: "DD MMM",
yValueFormatString: "$#,##0.#######",
toolTipContent: "Factory made - {x}<br><b>Max:</b> {y[1]}<br><b>Min:</b> {y[0]}",
dataPoints: factory_made_max_min_graph_prices
},
{
type: "spline",
showInLegend: true,
legendText: "Average Factory Prices",
legendMarkerColor: "#dee0ec",
color: "#dee0ec",
lineColor: "#dee0ec",
markerSize: 5,
xValueFormatString: "DD MMMM",
yValueFormatString: "$#,##0.#####",
xValueType: "dateTime",
toolTipContent: "Factory made - <b>{x}</b> </br> Avg: {y}",
dataPoints: factory_made_avg_graph_prices_stats
},
]
});
}
chart.render();
};
VM596:12 Uncaught ReferenceError: chart is not defined
at HTMLInputElement.slider.oninput (<anonymous>:12:9)