MapBox JS GL：未捕获的TypeError：无法读取未定义的属性“ x”

Question

我正在编写一个脚本来检索用户当前视图/区域中所有城市的列表。例如，如果用户放大到以下区域：

返回以下城市：威斯敏斯特，圣安娜，奥兰治，别墅公园，亨廷顿海滩，科萨梅萨，欧文，纽波特海滩。

我正在尝试使用MapBox的queryRenderedFeatures函数来获取城市列表。我将用户放大区域的边界框和图层列表（只是城市）作为参数传递给该示例，如下例：

https://docs.mapbox.com/mapbox-gl-js/example/queryrenderedfeatures-around-point/

下面是我的代码：

var map = new mapboxgl.Map({
    container: 'map',
                style: 'mapbox://styles/mapbox/streets-v11'
            });
var canvas = map.getCanvasContainer();
var bbox = canvas.getBoundingClientRect();
var transformedBBox = [[bbox.left, bbox.top], [bbox.right, bbox.bottom]];

// Retrieve the cities within the user's current area;
var features = map.queryRenderedFeatures(bbox, {layers: ['cities']});

但是我在最后一行（尝试检索功能时）收到以下错误：

  

未捕获的TypeError：无法读取未定义的属性'x'