OpenLayers und der verschobene Copyrightvermerk - Hilfe

Hallo,

ich arbeite derzeit an einer relativ “einfachen” Art, eine GPX-Datei auf OpenStreetMap zu bekommen. Verwendung findet dies in einer eigenen Android-App als “Vorschau” für Tracks/Waypoints.
An sich funktioniert dies super, dennoch wird der schöne Vermerkt “(C) OpenStreetMap contributors” ein wenig verschoben angezeigt (siehe Screenshot). Gleiches Problem innerhalb der App und auch am PC (Firefox).
Der Vermerk ist (normalerweise) am unteren Rand. Bei mir ist er ca. 2cm nach Oben verschoben. Ich kann mir leider nicht erklären an was es liegt. Die *.js beziehe ich direkt vom Server. Habe ich dieselbe Datei lokal gespeichert, ist der Vermerk am oberen Rand, darunter befindet sich dann der “Schalter” für die Attribution (der mit dem “+”, wenn ich das jetzt richtig Beschreibe).

Den Quellcode für die HTML-Datei (bzw. JavaScript) habe ich aus der Wiki und entsprechend angepasst (Übergabe des Dateinamen für GPX-Dateien: ?file=dateiname.gpx):

<html>
<head>
	<!-- Source: http://wiki.openstreetmap.org/wiki/Openlayers_Track_example -->
	<title></title>
	<!--  OpenLayers javascript library
	 	 Wir binden die  Bibliothek direkt aus dem Internet ein, 
	 	 die Datei kann bei Bedarf aber auch lokal abgespeichert werden)
	 -->
	<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
	<!-- OpenStreetMap OpenLayers layers.
		Diese Datei bevorzugt aus dem Internet laden um sie aktuell zu halten 
	 -->
	<script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
 
	<script type="text/javascript">
		//Dateipfad übergeben Anfang
		function Werteliste (querystring) {
			if (querystring == '') return;
				var wertestring = querystring.slice(1);
				var paare = wertestring.split("&");
				var paar, name, wert;
				
				for (var i = 0; i < paare.length; i++) {
					paar = paare[i].split("=");
					name = paar[0];
					wert = paar[1];
					name = unescape(name).replace("+", " ");
					wert = unescape(wert).replace("+", " ");
				this[name] = wert;
				}
		}
		var liste = new Werteliste(location.search);

		for (var eigenschaft in liste) {
			var dateipfad = liste[eigenschaft]
		}
		//Dateipfad übergeben Ende

		
		var map; //complex object of type OpenLayers.Map
 
		function init() {
			map = new OpenLayers.Map ("map", {
				controls:[
					new OpenLayers.Control.Navigation(),
					new OpenLayers.Control.PanZoomBar(),
					new OpenLayers.Control.LayerSwitcher(),
					new OpenLayers.Control.Attribution()],
				maxExtent: "auto", //new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
				maxResolution: "auto", // 156543.0399,
				minExtent: "auto",
				minResolution: "auto",
				numZoomLevels: 16,
				units: 'm',
				projection: new OpenLayers.Projection("EPSG:900913"),
				displayProjection: new OpenLayers.Projection("EPSG:4326")
				
			} );
 
			// Define the map layer
			// Here we use a predefined layer that will be kept up to date with URL changes
			layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
			map.addLayer(layerMapnik);
			layerCycleMap = new OpenLayers.Layer.OSM.CycleMap("CycleMap");
			map.addLayer(layerCycleMap);
			layerMarkers = new OpenLayers.Layer.Markers("Marker");
			map.addLayer(layerMarkers);
 
            // *********************************************************************
			// Block "Layer mit GPX-Track" - Start
			var GPXVariable_1 = new OpenLayers.Layer.Vector("Schlauchstrecke", {
				strategies: [new OpenLayers.Strategy.Fixed()],
				protocol: new OpenLayers.Protocol.HTTP({
					url: dateipfad, // "test.gpx"
					format: new OpenLayers.Format.GPX,
					formatOptions: {
								extractAttributes: true,
								extractStyles: false,
								extractTracks: true,
								extractRoutes: true,
								extractWaypoints: true
					},
				}),
				style: {strokeColor: "blue", strokeWidth: 5, strokeOpacity: 0.5},
				projection: new OpenLayers.Projection("EPSG:4326")
			});
			map.addLayer(GPXVariable_1);
			
		GPXVariable_1.events.register("loadend", GPXVariable_1,
		function() {
			var indx = 0;
			var len = this.features.length;
			for(i = false ; indx < len; ) {
				if (!OpenLayers.String.contains(this.features[indx].geometry.id,"LineString"))
					break;
			indx++;
			}
			var layerMarkers = new OpenLayers.Layer.Markers("Pumpenstandorte");
			map.addLayer(layerMarkers);
			var bounds = this.getDataExtent();
			lonLat = bounds.getCenterLonLat();
			// mark the center
			map.setCenter(lonLat);
			// fit zoom to bounds if desired
			map.zoomToExtent(bounds);
			
			var size = new OpenLayers.Size(21, 25);
			var offset = new OpenLayers.Pixel(-(size.w / 2), -size.h);

			if (indx < len) {
				icon = new OpenLayers.Icon('http://www.openstreetmap.org/openlayers/img/marker.png', size, offset);
				for( ; indx < len; indx++ ) {
					// create a marker for each waypoint 		
					var title = this.features[indx].attributes.name;
					var hoehe = this.features[indx].attributes.ele;
					var zeit = this.features[indx].attributes.time;
					var popupContentHTML = '<p><font face="Arial" size="-1"><ul><li>Punkt: '+title+'</li><li>H&ouml;he: '+hoehe+'</li><li>Zeit: '+zeit+'</li></ul></font></p>';
					var punkt = this.features[indx].geometry.bounds.getCenterLonLat().clone();
					feature = new OpenLayers.Feature(layerMarkers, punkt);
					feature.closeBox = true;
					feature.data.icon = icon.clone();
					feature.data.overflow = "hidden";
					feature.data.popupContentHTML = popupContentHTML;
					feature.popupClass = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {minSize: new OpenLayers.Size(200, 120) } ); 
					feature.popup = null;
					marker = feature.createMarker();
					marker.events.register("mousedown", feature, onMarkerMouseDown);
					layerMarkers.addMarker(marker);
				}
			}
		});
            // Block "Layer mit GPX-Track" - Ende
            // *********************************************************************
						
		}
		
		function onMarkerMouseDown(evt) {
			if (this.popup) {
				this.popup.toggle();
			}
			else {
				// new popup is to be generated
				var popup = this.createPopup(this.closeBox);
				popup.events.register("mousedown", this, onPopupMouseDown);
				this.layer.map.addPopup(this.popup);
				this.popup = popup;
				lastSelectedPopup = popup;
			}
			OpenLayers.Event.stop(evt);
		}

		function onPopupMouseDown(evt) {
			this.popup.toggle();
			OpenLayers.Event.stop(evt);
		};

		function displayAfterZoom(evt) {
			OpenLayers.Event.stop(evt);	
		}
	</script>
</head>
<!-- body.onload is called once the page is loaded (call the 'init' function) -->
<body onload="init();">
	<!-- define a DIV into which the map will appear. Make it take up the whole window -->
	<div style="width:100%; height:100%" id="map"></div>
	
</body>
</html>

Leider konnte ich, nach langer Suche bei Google, keine Lösung finden. Bzw. Lösungsansätze (eigenen Layer mit Erweiterung des Copyrights) sind leider gescheitert, da diese an der selben Stelle erschienen. Hat jemand einen Tipp oder Rat?

Vielen Dank
Gruß
Andy

Hi Andy,

erst mal herzlich willkommen im OSM-Forum, dem schnellsten Forum der Welt :wink:

Du musst das mit CSS machen.


.olControlAttribution {
	bottom: 		0.5em	!important;
        background-color: 	#ffffff;
}

setzt bei mir die Attributierung knapp oberhalb des unteren Randes mit weissem Hintergrund - aber das ist Geschmackssache.

siehe. http://osm.wno-edv-service.de:8080/residentials

Gruss
walter

— Gelöscht, war fast der gleicht Text wie in #2

Hallo Walter,
das ging wirklich flott :slight_smile: Und das tolle, es funktioniert! Vielen Dank für deinen Tipp und den CSS-Code! Jetzt sieht es nicht mehr so Halbherzig aus.

Geht übrigens um diese App (für Feuerwehren): https://play.google.com/store/apps/details?id=de.ki.wafoegps

Gruß
Andy

Ich brauch die zwar nicht, aber ich freue mich auch immer über Apps die nicht nur bei Google, sondern auch einfach auf der Homepage des Anbieters runterzuladen sind. Es soll nämlich Leute geben, die Android ohne Google-Konto und somit auch ohne Google-Play nutzen.

Christian

Hallo Christian,
die APK hatte ich anfangs am eigenen Server. Seit Start im G. Play nicht mehr. Habe dies aber wieder vor, wenn die “chaotische” Phase mit fast täglichen Updates herum ist :wink:

In diesem Sinne
Andy