Javascript Stackoverflow代码段抛出一个错误，但其外部正在工作

我在答案中创建了一个stackoverflow代码段，但是如果我使用的是

map.queryRenderedFeatures（）

，则会出现错误。在

index.html

中的代码段之外，所有这些都可以正常工作。这可能是CORS的问题吗？除了未定义的返回，我没有收到任何错误消息。奇怪的是，有时候它是以整版方式工作的

下面是我的片段：

mapboxgl.accessToken='pk.eyj1ijoichjhewvyiiwiysi6imi3ogrjzjcy2jiztuzodmwuxzddinjrimwe4nji5in0.zETX-x6-XPpAv3zt4MiFwg'；
var map=new mapboxgl.map({
容器：“映射”，
风格：'mapbox://styles/prayer/ciub6rm2j004v2iodiej359ox',
中间：[14.547]，
缩放：6
});
地图上（'点击'）功能（e）{
var features=map.queryRenderedFeatures({
图层：['roads-bm6ga5']，
过滤器：[“==”，“id”，1]
});
document.getElementById（'features'）。innerHTML='Road with ID'+features[0]。properties.ID+'的坐标为：'+
“
”+JSON.stringify（功能[0].geometry.coordinates，null，2）；
});
地图上的“加载”功能（e）{
警报（“在地图中单击以显示ID为1的道路坐标”）
});
body{margin:0；padding:0；}
#映射{位置：绝对；顶部：0；底部：0；宽度：100%；}
#特征{
位置：绝对位置；
排名：0；
右：0；
底部：0；
宽度：300px；
溢出：自动；
背景：rgba（255，255，255，0.8）；
}
#地图画布{
光标：十字线；
}

功能
是一个空白数组。因此
功能[0].properties.id
将抛出错误。您应该检查
features.length>0
Hmm谢谢！但在这种情况下，功能[0]不应为空。。我来看看为什么这件事会发生在小提琴外面它从来都不是空的。。原因是什么？似乎查询在内部无法正常工作fiddle@Rajesh你知道原因吗？不确定，但当我创建时，有一些额外的请求。主要是
23.vector.pbf
。这可能是原因。您应该检查是否所有向量都可用。
特征
是一个空白数组。因此
功能[0].properties.id
将抛出错误。您应该检查
features.length>0
Hmm谢谢！但在这种情况下，功能[0]不应为空。。我来看看为什么这件事会发生在小提琴外面它从来都不是空的。。原因是什么？似乎查询在内部无法正常工作fiddle@Rajesh你知道原因吗？不确定，但当我创建时，有一些额外的请求。主要是
23.vector.pbf
。这可能是原因。您应该检查是否所有向量都可用。