Discussion:
[OpenLayers-Users] OL3 and kml problem issue on Android 6.0.1
ScigallaP
2016-09-02 12:59:29 UTC
Permalink
Hello,

I'm new in OL and have an first simple question here.

My frist small project to show kml files with OL and OSM runs fine on my
local PC and on a webserver too. The result is shown on desktop (chrome
and firefox) and mobile browser (chrome and opera).

But when I cpoy the complete code (and file structure including kml
files) on my Android cellphone or tablet, only the OSM map is shown, but
no kml. Not with chrome and not with opera.

My devices are Galaxy Tab S2 and HTC ONE M8, both Android 6.

I want use it locale on Android devices, to beware download large kml
(>10 MB).

Here my code:

### BEGIN HTML code ###
<html>
<head>
<title>Hallo OSM</title>
<link rel="stylesheet" href="ol.css" type="text/css" />
<link rel="stylesheet" href="samples.css" type="text/css" />
</head>
<body>
<div id="map" class="map"></div>
<script src="ol.js"></script>
<script>

var vector = new ol.layer.Vector({
source: new ol.source.Vector({
url: 'kml/hydranten6.kml',
format: new ol.format.KML({
extractStyles: true,
extractAttributes: false,
maxDepth: 30
})
})
});

var ltg = new ol.layer.Vector({
source: new ol.source.Vector({
url: 'kml/leitungen.kml',
format: new ol.format.KML({
extractStyles: true,
extractAttributes: false,
maxDepth: 30
})
})
});
var osmLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var musterort = ol.proj.transform([13.94, 50.96], 'EPSG:4326',
'EPSG:3857');
var view = new ol.View({
center: musterort,
zoom: 18
});
var map = new ol.Map({
layers: [ltg, vector],
target: 'map'
});
map.setView(view);
</script>
</body>
</html>
### END HTML code ###

The HTML file, ol.css, samples.css, ol.js and both kml files are stored
in the same structure on Android as on PC and webserver.

Any help would be appreciated.

Thanks in advance!
Thomas Gratier
2016-09-03 13:52:32 UTC
Permalink
Hi,

Do you serve your HTML via a local server?
If you just put files like that without a web server, you will hit the same
origin policy issue to load KML because of an url call to kml file from an
url like file://your/path/your_index.html

Try a server like https://github.com/NanoHttpd/nanohttpd
Otherwise, try to use this recipe
http://stackoverflow.com/questions/8648616/webview-javascript-cross-domain-from-a-local-html-file
(never tested so no warranty)

Cheers

Thomas Gratier
Post by ScigallaP
Hello,
I'm new in OL and have an first simple question here.
My frist small project to show kml files with OL and OSM runs fine on my
local PC and on a webserver too. The result is shown on desktop (chrome and
firefox) and mobile browser (chrome and opera).
But when I cpoy the complete code (and file structure including kml files)
on my Android cellphone or tablet, only the OSM map is shown, but no kml.
Not with chrome and not with opera.
My devices are Galaxy Tab S2 and HTC ONE M8, both Android 6.
I want use it locale on Android devices, to beware download large kml (>10
MB).
### BEGIN HTML code ###
<html>
<head>
<title>Hallo OSM</title>
<link rel="stylesheet" href="ol.css" type="text/css" />
<link rel="stylesheet" href="samples.css" type="text/css" />
</head>
<body>
<div id="map" class="map"></div>
<script src="ol.js"></script>
<script>
var vector = new ol.layer.Vector({
source: new ol.source.Vector({
url: 'kml/hydranten6.kml',
format: new ol.format.KML({
extractStyles: true,
extractAttributes: false,
maxDepth: 30
})
})
});
var ltg = new ol.layer.Vector({
source: new ol.source.Vector({
url: 'kml/leitungen.kml',
format: new ol.format.KML({
extractStyles: true,
extractAttributes: false,
maxDepth: 30
})
})
});
var osmLayer = new ol.layer.Tile({
source: new ol.source.OSM()
});
var musterort = ol.proj.transform([13.94, 50.96], 'EPSG:4326',
'EPSG:3857');
var view = new ol.View({
center: musterort,
zoom: 18
});
var map = new ol.Map({
layers: [ltg, vector],
target: 'map'
});
map.setView(view);
</script>
</body>
</html>
### END HTML code ###
The HTML file, ol.css, samples.css, ol.js and both kml files are stored in
the same structure on Android as on PC and webserver.
Any help would be appreciated.
Thanks in advance!
_______________________________________________
Users mailing list
http://lists.osgeo.org/mailman/listinfo/openlayers-users
Loading...