Mapbox JS - 群集计数层上的异常

我收到了一个具有多个群集的Mapbox地图和一个无异常工作的非群集层。但是，当我尝试添加集群计数层时，我在控制台中获得以下错误：未捕获的TypeError：无法使用'in'运算符在未定义的中搜索'point_count'。Mapbox JS - 群集计数层上的异常

我跟着the Mapbox cluster tutorial，但不明白为什么这个错误显示出来。

这里是我的代码：

function setMyApplicationLayers(map, layers) { 
    getMyApplicationLayers().forEach(function(layer) { 
     map.addLayer(layer); 
    }) 
} 

function getMyApplicationLayers() { 
    var layers = [getMyApplicationRestaurantItemLayer()]; 

    ['#ef59a1', '#6ecff6', '#d7df21'] 
      .forEach(function(color, index) { 
     layers.push(getMyApplicationRestaurantGroupLayer(index, color)); 
    }); 

    layers.push(getMyApplicationRestaurantCountLayer()); 

    return layers; 
} 

function getMyApplicationRestaurantItemLayer() { 
    return { 
     id: 'unclustered-restaurants', 
     type: 'symbol', 
     source: 'my-application-restaurants', 
     layout: { 
      'icon-image': 'marker-15' 
     } 
    } 
} 

function getMyApplicationRestaurantGroupLayer(index, color) { 
    return { 
     id: 'clustered-restaurants-' + index, 
     type: 'circle', 
     source: 'my-application-restaurants', 
     paint: { 
      'circle-color': color, 
      'circle-radius': 18 
     }, 
     filter: getMyApplicationRestaurantGroupLayerFilter(index) 
    } 
} 

function getMyApplicationRestaurantGroupLayerFilter(index) { 
    switch (index) { 
     case 0: 
      return ['>=', 'point_count', 25] 
     case 1: 
      return ['all', 
       ['>=', 'point_count', 5], 
       ['<', 'point_count', 25]] 
     case 2: 
      return ['all', 
       ['>=', 'point_count', 0], 
       ['<', 'point_count', 5]] 
    } 
} 

function getMyApplicationRestaurantCountLayer() { 
    return { 
     id: 'cluster-count', 
     type: 'symbol', 
     source: 'my-application-restaurants', 
     layout: { 
      'text-field': '{point_count}', 
      'text-font': [ 
       'DIN Offc Pro Medium', 
       'Arial Unicode MS Bold' 
      ], 
      'text-size': 12 
     } 
    } 
}

来源

2016-08-22 OhmWang

我没有看到张贴的代码的任何问题。你能发布一个演示错误的可运行示例吗？ –

这里是一个[JSFiddle]（https://jsfiddle.net/dyhhqLda/2/）。尝试缩放/取消缩放并查看控制台。谢谢！ – OhmWang

此异常由不正确的GeoJSON的结构造成的。

在所提供的jsfiddle你包括一些GeoJSON的功能结构像这样的：

{ 
    type: 'Feature', 
    geometry: { 
     type: 'Point', 
     properties: { 
      description: 'kuk' 
     }, 
     coordinates: [2.7, 46.95] 
    } 
}

的GeoJSON的规范说：

A feature object must have a member with the name "properties". The value of the properties member is an object (any JSON object or a JSON null value).

的properties成员应该是Feature对象上，而不是Point对象。一份正确格式化的功能将类似于

{ 
    type: 'Feature', 
    properties: { 
     description: 'kuk' 
    }, 
    geometry: { 
     type: 'Point', 
     coordinates: [2.7, 46.95] 
    } 
}

这里是没有错误修改的演示：https://jsfiddle.net/dyhhqLda/2/

来源

2016-08-24 17:26:29

Mapbox JS - 群集计数层上的异常

回答

相关问题