Openlayers: OSM zeigen sich nicht auf div

Ich versuche, die Karteninhalte von OpenStreetMap in ein div in meinem Hybrid-Handy-App zu laden, mit dem folgenden Code:Openlayers: OSM zeigen sich nicht auf div

-js:

.controller('myCtrl', function($scope, $state, $ionicPopup, $cordovaGeolocation, Util) 
       { 

      if (! $scope.firstloaded) 
      { 
      var map = new OpenLayers.Map("basicMap"); 

      var mapnik = new OpenLayers.Layer.OSM(); 

      var fromProjection = new OpenLayers.Projection("EPSG:4326"); 

      // Transform from WGS 1984 
      var toProjection = new OpenLayers.Projection("EPSG:900913"); 

      // to Spherical Mercator Projection 
      var position = new OpenLayers.LonLat(13.41,52.52).transform(fromProjection, toProjection); 

      var zoom = 15; 

      map.addLayer(mapnik); 
      map.setCenter(position, zoom); 

      $scope.firstloaded = true; 
      }

-HTML:

<label class="item item-input"> 
     <span class="input-label">Location</span> 
     <div id="basicMap" style="height:250px"></div> 
    </label>

.. Allerdings weiß ich nicht, warum die Karte auf das div nicht angezeigt wird.

Also, stimmt irgendetwas mit dem Code nicht? Wie ist es möglich, dieses Problem zu beheben?

Quelle

2016-06-09 Kais

Möglicherweise müssen Sie das Ionic Whitelist-Plugin für Anfragen an bestimmte Domains auschecken, auch jede DOM-Manipulation in eckigen sollte in einer Direktive erfolgen, würde nach einer guten eckigen Direktive für offene Straßenkarten suchen oder anfangen zu arbeiten Auf eins. – shaunhusain

@shaunhusain Whitelist-Plugin ist bereits installiert. dies ist die verwendete Konfiguration: ' ' – Kais

@JoseHermosillaRodrigo das NPM-Modul wurde nicht korrekt geladen, es ist fehlgeschlagen mit den folgenden g Fehler: "Fehler beim Instanziieren der Modul-App aufgrund von: [$ injector: modulerr] Fehler beim Instanziieren der openlayers-Anweisung des Moduls wegen: [$ injector: nomod] Das Modul 'openlayers-directive' ist nicht verfügbar! Sie haben entweder den Modulnamen falsch geschrieben oder vergessen, ihn zu laden. " – Kais

Schauen Sie sich das einfache Beispiel an, wie im Folgenden beschrieben OpenStreetMap Example.

Sobald es funktioniert, können Sie das gleiche mit Ihrer Implementierung erweitern, da es alle Voraussetzungen für eine funktionierende Codebasis hat, die erweitert werden kann.

Quelle

2016-06-12 10:11:37 Gandhi

Openlayers: OSM zeigen sich nicht auf div

Antwort

Verwandte Themen