javascript - ng-map only opens remote KML file but not local file? -
i'm using ionic , ng-map. have display different kmls (one @ time , on user request). kml loads on map remote kmls. 1 works:
<div style="height: 100%"> <ng-map center="41.876,-87.624" zoom="15" map-type-id="hybrid" style="display:block; width: 100%; height:100%;"> <kml-layer url="http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml"></kml-layer> </ng-map> </div>
my local kmls in kml
folder inside www
directory in ionic app.
and i'm loading local kml file (same syntax remote kml file):
<div style="height: 100%"> <ng-map center="41.876,-87.624" zoom="15" map-type-id="hybrid" style="display:block; width: 100%; height:100%;"> <kml-layer url="./kml/cta.kml"></kml-layer> </ng-map> </div>
but kml lines don't show remote kml file. map loaded without lines specified in kml.
so, ng-map
require remote kml load kml specs? bug on ng-map
or ionic directories?
i don't errors or indicating there's wrong except local kml file can't seem read specs won't show on map unlike remote kml file.
it not bug neither of ng-map
library nor ionic
. ng-map
library utilizes kml layers
in turn not support loading of kml file localhost or file system.
basically have 2 options here:
1) place kml file on public server google server can access it, since parsing of kml , rendering done google servers
2) utilize third party library such geoxml3 library allows load kml file , parse hosted on localhost shown below:
html
<div ng-app="mapapp" ng-controller="mapcontroller"> <ng-map center="41.876,-87.624" zoom="15" map-type-id="hybrid" style="display:block; width: 100%; height:100%;"/> </div>
js
angular.module('mapapp', ['ngmap']) .controller('mapcontroller', function($scope, ngmap) { ngmap.getmap().then(function(map) { $scope.map = map; var myparser = new geoxml3.parser({ map: map }); myparser.parse('cta.kml'); }); });
Comments
Post a Comment