javascript - OSMdroid map 源码

Question

我只有显示 osmdroid map 源的 javascript 文件，我使用了

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

我打开了这个地址，但那里什么也没有，但 gps.4u.uz 运行良好。

但是我有空网格，如果我使用其他源，它就可以工作。请帮我看看出了什么问题。我的 javascript 文件只是重定向，它不是为我编写的。这就是为什么我很难解决这个问题。这是我的文件:

<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>

Answer 1

osmdroid，用于 map 的 Android 库，本身可与 Z/X/Y 瓦片坐标引用系统配合使用，其用途与

• openstreetmaps.org
• 谷歌地图(静态图 block )
• 冰
• map task
• map 框
• 某些美国地质调查局来源
• 还有更多

其中大部分的 URL 模式几乎是通用的， http://server:port/path/zoom/x/y.png

请参阅 openstreetmap wiki，了解此处坐标的含义: http://wiki.openstreetmap.org/wiki/Slippy_Map

长话短说，使用 osmdroid 解决问题的最简单方法如下: mMapView.setTileSource(new XYTileSource( "bright-v9",0,22,256,"", new String[]{"https://gps.4u.uz:55443/styles/bright-v9/"} ))；