1

Попробуйте создать карту листов с кластеризационными маркерами в моем приложении. Использование для этого плагина DirectLightlet Direct. Это работа с примером контроллера и данных JSON, но у меня есть другой JSON с другим форматом данных и проблема с получением параметров решетки и долготы для создания массива маркеров на моей карте.Директивы с угловым лифтом + маркеры JSON

Мой контроллер

app.controller("BasicFirstController", [ "$scope", "$http", function($scope, $http) { 

      var addressPointsToMarkers = function(points) { 
       return points.map(function(ap) { 
       return { 
        layer: 'realworld', 
        lat: ap[0], 
        lng: ap[1], 
       message: ap[2]     
       }; 
       }); 
      }; 

      angular.extend($scope, { 
       center: { 
        lat: 53.13207624721133, 
        lng: 26.01689853383789, 
        zoom: 15 
       }, 
       events: { 
        map: { 
         enable: ['moveend', 'popupopen'], 
         logic: 'emit' 
        }, 
        marker: { 
         enable: [], 
         logic: 'emit' 
        } 
       }, 
       layers: { 
        baselayers: { 
         osm: { 
          name: 'OSM', 
          url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', 
          type: 'xyz' 
         },       

        overlays: { 
         realworld: { 
          name: "Real world data", 
          type: "markercluster", 
          visible: true 
         } 
        } 
       } 
      }); 

      $http.get("sample.json").success(function(data) { 
       $scope.markers = addressPointsToMarkers(data); 
      }); 
     }]); 

Работа с этим форматом JSON

[ 
[-37.8839, 175.3745188667, "571"], 
[-37.8869090667, 175.3657417333, "486"], 
[-37.8894207167, 175.4015351167, "807"], 
[-37.8927369333, 175.4087452333, "899"], 
[-37.90585105, 175.4453463833, "1273"] 
] 

Нужна работа с этим JSON формате

{ 
    "posts": [ 
     { 
      "ID": "1", 
      "title": "Title", 
      "tag": "tag1", 
      "lat": "53.11691211703813", 
      "lng": "26.03631556034088", 
      "thumb": "getImage-24-100x100.jpg", 
      "fullimg": "getImage-24.jpg", 
      "imgs": [ 
       { 
        "imgurl": "getImage-24-300x200.jpg" 
       } 
      ], 
      "place": "Place", 
      "type": "Photo", 
      "period": "War", 
      "year": "1985", 
      "url": "site.com", 
      "author": "author" 
     }, 
     { 
      "ID": "2", 
      "title": "Title2", 
      "tag": "tag2", 
      "lat": "53.11691211703813", 
      "lng": "26.03631556034088", 
      "thumb": "getImage-24-100x100.jpg", 
      "fullimg": "getImage-24.jpg", 
      "imgs": [ 
       { 
        "imgurl": "getImage-24-300x200.jpg" 
       } 
      ], 
      "place": "Place", 
      "type": "Photo", 
      "period": "War", 
      "year": "1935", 
      "url": "site.com", 
      "author": "author" 
     } 
] 
} 

Как получить данные с Lat и LNG из JSON для маркеров массива ?

+0

это немного трудно понять, что вы просите, но это выглядит как все, что ваш код является запускается через 'addressPointsToMarkers', поэтому он работал с исходным списком списков, но не работал со вторым JSON, так как это не список ... Поэтому вам нужно переписать' addressPointsToMarkers' для стартеров ... – kuanb

ответ

0

Вот что работал для меня с файлом JSON отправляется с сервера, чтобы опубликовать все маркеры сразу:

Затем с $ HTTP можно «получить» данные, но вы должны петли через него и толкать детали в новый массив $ области видимости:

$scope.markers = [] 
    $http.get('JSONfilePath').then(function (responseData) { 
     for (var i = 0; i < responseData.data.length; i++){ 
      $scope.markers.push({ 
        lat: responseData.data[i].latitude, 
        lng: responseData.data[i].longitude 
      }) 
     } 
    }) 

в HTML файл, это довольно прямо вперед:

<leaflet lf-center="center" defaults="defaults" markers="markers" width="90%" height="800px"></leaflet>