CODEWITHSUNDEEP
javascriptandroidosmdroid
Madina
Madina

Reputation: 25

OSMdroid map source

I have only javascript file that shows osmdroid map source, I used

String[] OSMSource = new String[1];
OSMSource[0] = "https://gps.4u.uz:55443/styles/bright-v9/";

I opened this address, but there is nothing there, but gps.4u.uz is working well.

But I have empty grid, if I use another source, it works. Please, help me what is wrong. My javascript file only redirection, it was not written for me. That is why, it is difficult for me to fix the problem. Here is my file:

<div id="maptools"> Map tools (<span id="myposition"></span>)</div>
<div id="bigmap"></div>
<script>
var tailserver = 'https://gps.4u.uz:55443/styles/bright-v9/rendered/{z}/{x}/{y}.png';
//var tailserver = 'http://192.168.123.3:88/styles/bright-v9/rendered/{z}/{x}/{y}.png';
var maptarget = 'bigmap';
var firstloc = [69.279,41.2781];
var markerico = '/images/marker.png';
var companyhtml = '&copy; OOO "Technounit-Group", <a href="http://technounit.uz">http://technounit.uz</a>';

var fstLoc = ol.proj.transform( firstloc, 'EPSG:4326', 'EPSG:3857');
var trackFeature = new ol.Feature({
	geometry: new ol.geom.LineString([])
});
var myMarker = new ol.Feature({
	type: 'icon',
	geometry: new ol.geom.Point(fstLoc)
});
	
var styles = {
	'techno': new ol.style.Style({
		image: new ol.style.Icon({
			anchor: [0.5, 1],
			src: markerico
		}),
		stroke: new ol.style.Stroke({
			color: 'rgba(0,0,255,1.0)',
			width: 3,
			lineCap: 'round'
		})
    })
};

var vectorLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
        features: [myMarker,trackFeature]
    }),
    style: styles["techno"]
});
	
var view = new ol.View({
	center: fstLoc,
    zoom: 15
});
var attribution = [new ol.Attribution({
    html: companyhtml
})];
//var rasterLayer = new ol.layer.Tile({
//	source: new ol.source.OSM()
//});
var rasterLayer = new ol.layer.Tile({
    source: new ol.source.XYZ({
		attributions: attribution,
		url: tailserver
	})
});
		  
var map = new ol.Map({
	target: maptarget,
	layers: [rasterLayer],
	view: view
});

function dotopos(lon,lat){
	//var newloc = ol.proj.fromLonLat([lon,lat]);
	//alert("To loc: "+lon+', '+lat);
	var newloc = ol.proj.transform([lon,lat], 'EPSG:4326', 'EPSG:3857');
	//alert("NewLoc: "+newloc);
	
	//trackFeature.getGeometry().appendCoordinate(newloc);
	
	view.setCenter(newloc);
	myMarker.setGeometry(new ol.geom.Point(newloc));
}
function dotoposicon(lon,lat){
	var newloc = ol.proj.transform([lon,lat], 'EPSG:4326', 'EPSG:3857');
	view.setCenter(newloc);
	myMarker.setGeometry(new ol.geom.Point(newloc));
}
function doRefresh(){
	//$(".coordsmsg").append('<font style="color:red; ">...</font>');
	
	$.ajax({  
		type: "POST",  
		url: "/track/coords.php",  
		data: "f=eventform",  
		success: function( res ){ 
		//alert(res);
			var gpsdata = jQuery.parseJSON( res );
			if( gpsdata.lon > 0 && gpsdata.lat> 0 ){
				$(".coordsmsg").text("New coords("+gpsdata.date+"): "+gpsdata.lon+', '+gpsdata.lat);
				var lon = parseFloat(gpsdata.lon);
				var lat = parseFloat(gpsdata.lat);
				//dotopos(lon,lat);
			}
			setTimeout('doRefresh()', 10000);
			
		} 
	});
}
//doRefresh();  
</script>

Upvotes: 0

Views: 452

Answers (1)

spy
spy

Reputation: 3258

osmdroid, the android library for maps, natively works with the Z/X/Y tile coordinate reference system, which is the same used as

  • openstreetmaps.org
  • google maps (static tiles)
  • bing
  • mapquest
  • mapbox
  • certain USGS sources
  • and many more

The url pattern for most of this is nearly universally, http://server:port/path/zoom/x/y.png

See the openstreetmap wiki about what the coordinates mean here: http://wiki.openstreetmap.org/wiki/Slippy_Map

Long story short, the easiest way to solve your problem using osmdroid is the following: mMapView.setTileSource(new XYTileSource( "bright-v9",0,22,256,"", new String[]{"https://gps.4u.uz:55443/styles/bright-v9/"} ));

Upvotes: 3

Related Questions