Ember-leaflet无效的LatLng对象

时间:2017-01-10 18:02:56

标签: javascript ember.js leaflet ember-cli

当地图上只显示一个元素时,我遇到了一个问题:

Uncaught Error: Invalid LatLng object: (NaN, NaN) at L.LatLng (LatLng.js:24) at Object.unproject (Projection.SphericalMercator.js:29) at Object.pointToLatLng (CRS.js:31) at NewClass.unproject (Map.js:899) at NewClass._getBoundsCenterZoom (Map.js:250) at NewClass.fitBounds (Map.js:269) at Class.didCreateLayer (leaflet-map.js:59) at Class.didInsertParent (base-layer.js:90) at Object.applyStr [as default] (ember.debug.js:38924) at tryInvoke (ember.debug.js:39441)

当有两个具有相同位置的标记时,也会发生同样的情况。当有两个不同的位置添加到边界时,一切都是正确的。

在基于我得到的结果的控制器中,我创建了这样的边界:

var latLngs = Ember.A();

this.get('results').forEach(function(value){
  latLngs.push(value.get('location'));
});

this.set('bounds', L.latLngBounds(latLngs));

然后在模板中我有这样的事情:

{{#leaflet-map bounds=bounds class="fullscreen-map" as |layers|}} {{layers.tile url="http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png"}} {{#each results as |provider|}} {{#layers.marker location=provider.location as |marker|}} {{#marker.popup}} <h4>{{provider.businessName}}</h4> <dl> <dt>{{t 'sp-provider-map.address'}}</dt> <dd>{{provider.street}} {{provider.houseNumber}}, {{provider.postCode}} {{provider.city}}</dd> <dt>{{t 'sp-provider-map.rating'}}</dt> <dd class="rating">{{{sp-provider-rating rating=provider.rating}}}</dd> </dl> {{/marker.popup}} {{/layers.marker}} {{/each}} {{/leaflet-map}}

结果的每个元素都具有属性位置,该位置在模型中以下列方式创建:

location: (function() { return L.latLng(parseFloat(this.get('latitude')), parseFloat(this.get('longitude'))); }).property('latitude', 'longitude'),

可能是什么问题?我应该以不同的方式创建边界吗?

感谢您的帮助!

0 个答案:

没有答案