تحليل إحداثيات نشرة الجمرة من json باستخدام نماذج الجمرة

Question

أنا جديد على ember و ember-leaflet.js.أحاول تغذية البيانات (عبر ملف ajax اتصل بـ أ json file) إلى كل من قالب المقاود الخاص بي وخريطة نشرة الجمرة الخاصة بي.مع الإعداد الحالي الخاص بي، تصل البيانات إلى قالب المقاود الخاص بي بشكل جيد، ولكنها لا تعرض بيانات الإحداثيات على خريطة نشرة الجمرة.

أنا أستخدم المثالين المذكورين أدناه كدليل لي، لكني اصطدمت بحائط بسبب قلة خبرتي في استخدام الجمر.هل يمكن لأي شخص أن يوجهني في الاتجاه الصحيح من فضلك؟

مثال اياكس وجمرة

مثال جزئي لما أحاول تحقيقه

قالب المقاود:

 <script type="text/x-handlebars" data-template-name="application">
    {{outlet}}

  </script>

   <script type="text/x-handlebars" data-template-name="index">
      {{view App.MapView id="map"}}
      <div id="blog">
        <ul>
            {{#each item in model}}
                <li>{{item.headline}}</li>
            {{/each}}
        </ul>    
    </div>  
  </script>

جمرة:

App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.IndexRoute = Ember.Route.extend({
    model: function(){
        return App.Item.all();
    }
});

App.Item = Ember.Object.extend();

App.Item.reopenClass({
  all: function() {
      return $.getJSON("js/data/test_e.json").then(function(response) {
        var items = [];

        response.features.forEach( function (data) {
          items.push( App.Item.create(data) );
        });

          return items;
      });
  }
});

App.MarkerCollectionLayer =
  EmberLeaflet.MarkerCollectionLayer.extend({
    locationBinding: 'controller.item.center'});

App.MapView = EmberLeaflet.MapView.extend({
    childLayers: [
      EmberLeaflet.DefaultTileLayer,
      App.MarkerCollectionLayer]
});

App.IndexController =
  Ember.Controller.extend({});

ملف جيسون:

{
    "features": [
        {
            "headline": "Docker, the Linux container runtime: now open-source",
            "center" : [40.714, -74.000]
        },
        {
            "headline": "What's Actually Wrong with Yahoo's Purchase of Summly",
            "center" : [40.714, -73.989]

        }
    ]
}

Answer 1

الإصلاح الرئيسي المطلوب هنا هو locationBinding في MarkerCollectionLayer.ال location يجب أن يكون الربط في فئة MarkerLayer.وعلاوة على ذلك، تحتاج إلى استخدام EmberLeaflet.computed وظائف لتحويل صفائف lat lng البسيطة إلى كائن Leaflet LatLng.انظر هذا المثال:

App.MarkerCollectionLayer = EmberLeaflet.MarkerCollectionLayer.extend({
  content: Ember.computed.alias('controller'),
  itemLayerClass: EmberLeaflet.MarkerLayer.extend({
    location: EmberLeaflet.computed.latLngFromLatLngArray('content.center'),
  })
});

تحقق من JSFiddle مع مثال عملي كامل: http://jsfiddle.net/xALu4/2/