Charts 未捕获类型错误：无法读取属性'；xAxis'；未定义海图的定义_Charts_Highcharts

Charts 未捕获类型错误：无法读取属性'；xAxis'；未定义海图的定义

charts highcharts

Charts 未捕获类型错误：无法读取属性'；xAxis'；未定义海图的定义,charts,highcharts,Charts,Highcharts,我尝试从两个以上的图表进行同步缩放，就像在本例中一样问题是图表正在显示，但控制台中存在“未捕获的TypeError:无法读取未定义的属性'xAxis'，并且同步也无法工作这是我的密码 <script type="text/javascript"> $(function () { var chart1; var chart2; $.getJSON('http://sine.co.i

我尝试从两个以上的图表进行同步缩放，就像在本例中一样

问题是图表正在显示，但控制台中存在“未捕获的TypeError:无法读取未定义的属性'xAxis'，并且同步也无法工作

这是我的密码

        <script type="text/javascript">

        $(function () {
            var chart1;
            var chart2;


        $.getJSON('http://sine.co.id/PHESIAK/laporan/getJSON.php', function (data) {

        Highcharts.setOptions({
            global: {
                useUTC: false
            }
        });

        $(document).ready(function () {
                chart1 = new Highcharts.StockChart({
                    chart: {
                        renderTo: 'container',
                    },      


                title: {
                    text: 'Data Monitoring Uji Coba Fast',
                    style: {
                    color: 'black',
                    fontWeight: 'bold',
                    fontSize: '50px'
                }
                },

                subtitle: {
                    text: 'Temperature Sensor Well Head 81',
                    style: {
                    color: '#3366AA',
                    fontSize: '30px'
                    }
                },

                xAxis: {
                    gapGridLineWidth: 0,
                    events: {
                            afterSetExtremes: function (event) {
                                var xMin = event.min;
                                var xMax = event.max;
                                var ex = chart2.xAxis[0].getExtremes();


                                if (ex.min != xMin || ex.max != xMax) chart2.xAxis[0].setExtremes(xMin, xMax, true, false);
                            }
                        }
                },

                rangeSelector: {
                    buttons: [{
                        type: 'hour',
                        count: 1,
                        text: '1h'
                    }, {
                        type: 'day',
                        count: 1,
                        text: '1D'
                    }, {
                        type: 'all',
                        count: 1,
                        text: 'All'
                    }],
                    selected: 1,
                    inputEnabled: false
                },

                series: [{
                    name: 'Fahrenheit',
                    type: 'area',
                    data: data,
                    gapSize: 5,
                    tooltip: {
                        valueDecimals: 2
                    },
                    fillColor: {
                        linearGradient: {
                            x1: 0,
                            y1: 0,
                            x2: 0,
                            y2: 1
                        },
                        stops: [
                            [0, '#003399'],
                            [1, '#3366AA']
                        ]
                    },
                    threshold: null
                }]
            });
        });
        });
        });
                </script>


        <script type="text/javascript">

        $.getJSON('http://sine.co.id/PHESIAK/laporan/getJsonPres.php', function (data1) {


        Highcharts.setOptions({
            global: {
                useUTC: false
            }
        });

        $(document).ready(function () {
                chart2 = new Highcharts.StockChart({
                    chart: {
                        renderTo: 'container1',
                    },  


                title: {
                    text:  ''
                },

                subtitle: {
                    text: 'Pressure Sensor Well Head 81',
                    style: {
                    color: '#D43346',
                    fontSize: '30px'
                    }
                },

                xAxis: {
                    gapGridLineWidth: 0,

                    events: {
                            afterSetExtremes: function (event) {
                                var xMin = event.min;
                                var xMax = event.max;
                                var ex = chart1.xAxis[0].getExtremes();


                                if (ex.min != xMin || ex.max != xMax) chart1.xAxis[0].setExtremes(xMin, xMax, true, false);
                            }
                        }
                },

                rangeSelector: {
                    buttons: [{
                        type: 'hour',
                        count: 1,
                        text: '1h'
                    }, {
                        type: 'day',
                        count: 1,
                        text: '1D'
                    }, {
                        type: 'all',
                        count: 1,
                        text: 'All'
                    }],
                    selected: 1,
                    inputEnabled: false
                },

                series: [{
                    name: 'PSI',
                    type: 'area',
                    data: data1,
                    gapSize: 5,
                    tooltip: {
                        valueDecimals: 2
                    },
                    fillColor: {
                        linearGradient: {
                            x1: 0,
                            y1: 0,
                            x2: 0,
                            y2: 1
                        },
                        stops: [
                            [0, '#ad1a2c'],
                            [1, '#D43346']
                        ]
                    },
                    threshold: null
                }]
            });
        });
        });
                </script>


$（函数（）{
var-chart1；
var-chart2；
$.getJSON（'http://sine.co.id/PHESIAK/laporan/getJSON.php，函数（数据）{
Highcharts.setOptions({
全球：{
useUTC:false
}
});
$（文档）.ready（函数（）{
chart1=新的Highcharts.StockChart({
图表：{
renderTo:'容器'，
},      
标题：{
文本：“数据监控Uji Coba Fast”，
风格：{
颜色：'黑色'，
fontWeight:'粗体'，
字体大小：“50px”
}
},
副标题:{
文字：“温度传感器井口81”，
风格：{
颜色：“#3366AA”，
字体大小：“30px”
}
},
xAxis：{
gapGridLineWidth:0，
活动：{
AfterSetExtrems:函数（事件）{
var xMin=event.min；
var xMax=event.max；
var ex=chart2.xAxis[0].getExtremes（）；
if（ex.min！=xMin | | ex.max！=xMax）chart2.xAxis[0].setextrems（xMin，xMax，true，false）；
}
}
},
范围选择器：{
按钮：[{
键入：“小时”，
计数：1，
文本：“1h”
}, {
键入：'天'，
计数：1，
文本：“1D”
}, {
键入：“全部”，
计数：1，
文字：“全部”
}],
选定：1，
输入：假
},
系列：[{
名称：'华氏'，
类型：'区域'，
数据：数据，
昏睡：5，
工具提示：{
数值小数：2
},
填充颜色：{
线性梯度：{
x1:0，
y1:0，
x2:0，
y2:1
},
停止：[
[0, '#003399'],
[1'#3366AA']
]
},
阈值：空
}]
});
});
});
});
$.getJSON（'http://sine.co.id/PHESIAK/laporan/getJsonPres.php，函数（数据1）{
Highcharts.setOptions({
全球：{
useUTC:false
}
});
$（文档）.ready（函数（）{
chart2=新的Highcharts.StockChart({
图表：{
renderTo:'container1'，
},  
标题：{
文本：“”
},
副标题:{
文字：“压力传感器井口81”，
风格：{
颜色：“#D43346”，
字体大小：“30px”
}
},
xAxis：{
gapGridLineWidth:0，
活动：{
AfterSetExtrems:函数（事件）{
var xMin=event.min；
var xMax=event.max；
var ex=chart1.xAxis[0].getExtremes（）；
if（ex.min！=xMin | | ex.max！=xMax）chart1.xAxis[0].setextrems（xMin，xMax，true，false）；
}
}
},
范围选择器：{
按钮：[{
键入：“小时”，
计数：1，
文本：“1h”
}, {
键入：'天'，
计数：1，
文本：“1D”
}, {
键入：“全部”，
计数：1，
文字：“全部”
}],
选定：1，
输入：假
},
系列：[{
名称：“PSI”，
类型：'区域'，
数据：数据1，
昏睡：5，
工具提示：{
数值小数：2
},
填充颜色：{
线性梯度：{
x1:0，
y1:0，
x2:0，
y2:1
},
停止：[
[0，#ad1a2c']，
[1'#d4346']
]
},
阈值：空
}]
});
});
});

有什么建议吗？我想我卡住了。感谢您的关注。

之所以发生这种情况，是因为您在ajax调用中设置了两个图表（

$.getJSON

）。因此

1: 
var chart1 = $('#container').highcharts();
var chart2 = $('#container1').highcharts();

2:
$('#container').highcharts().xAxis[0].setExtremes
$('#container1').highcharts().xAxis[0].setExtremes

$(document).ready(function() {
var chart1;
var chart2;

$.getJSON('http://sine.co.id/PHESIAK/laporan/getJSON.php?callback=?',  function(data) {

 chart1 = new Highcharts.StockChart({
   chart: {
     renderTo: 'container1',
   },


   title: {
     text: 'Data Monitoring Uji Coba Fast',
     style: {
       color: 'black',
       fontWeight: 'bold',
       fontSize: '50px'
     }
   },

   subtitle: {
     text: 'Temperature Sensor Well Head 81',
     style: {
       color: '#3366AA',
       fontSize: '30px'
     }
   },

   xAxis: {
     gapGridLineWidth: 0,
     events: {
       afterSetExtremes: function(event) {
         var xMin = event.min;
         var xMax = event.max;
         var ex = chart2.xAxis[0].getExtremes();


         if (ex.min != xMin || ex.max != xMax) chart2.xAxis[0].setExtremes(xMin, xMax, true, false);
       }
     }
   },

   rangeSelector: {
     buttons: [{
       type: 'hour',
       count: 1,
       text: '1h'
     }, {
       type: 'day',
       count: 1,
       text: '1D'
     }, {
       type: 'all',
       count: 1,
       text: 'All'
     }],
     selected: 1,
     inputEnabled: false
   },

   series: [{
     name: 'Fahrenheit',
     type: 'area',
     data: data,
     gapSize: 5,
     tooltip: {
       valueDecimals: 2
     },
     fillColor: {
       linearGradient: {
         x1: 0,
         y1: 0,
         x2: 0,
         y2: 1
       },
       stops: [
         [0, '#003399'],
         [1, '#3366AA']
       ]
     },
     threshold: null
   }]
 });
 });






$.getJSON('http://sine.co.id/PHESIAK/laporan/getJsonPres.php?callback=?', function(data1) {
 chart2 = new Highcharts.StockChart({
   chart: {
     renderTo: 'container2',
   },


   title: {
     text: ''
   },

   subtitle: {
     text: 'Pressure Sensor Well Head 81',
     style: {
       color: '#D43346',
       fontSize: '30px'
     }
   },

   xAxis: {
     gapGridLineWidth: 0,

     events: {
       afterSetExtremes: function(event) {
         var xMin = event.min;
         var xMax = event.max;
         var ex = chart1.xAxis[0].getExtremes();


         if (ex.min != xMin || ex.max != xMax) chart1.xAxis[0].setExtremes(xMin, xMax, true, false);
       }
     }
   },

   rangeSelector: {
     buttons: [{
       type: 'hour',
       count: 1,
       text: '1h'
     }, {
       type: 'day',
       count: 1,
       text: '1D'
     }, {
       type: 'all',
       count: 1,
       text: 'All'
     }],
     selected: 1,
     inputEnabled: false
   },

   series: [{
     name: 'PSI',
     type: 'area',
     data: data1,
     gapSize: 5,
     tooltip: {
       valueDecimals: 2
     },
     fillColor: {
       linearGradient: {
         x1: 0,
         y1: 0,
         x2: 0,
         y2: 1
       },
       stops: [
         [0, '#ad1a2c'],
         [1, '#D43346']
       ]
     },
     threshold: null
   }]
 });
});
});