changeset 182:d314c48d16a9 gmap2

Make markers with labels.
author Matti Hamalainen <ccr@tnsp.org>
date Wed, 12 Mar 2014 01:21:50 +0200
parents 17646f458b1c
children a0f377c415ee
files css/mapstyle1.css index.php markers.js
diffstat 3 files changed, 19 insertions(+), 1 deletions(-) [+]
line wrap: on
line diff
--- a/css/mapstyle1.css	Wed Mar 12 00:21:46 2014 +0200
+++ b/css/mapstyle1.css	Wed Mar 12 01:21:50 2014 +0200
@@ -201,3 +201,15 @@
 	color: rgba(255,255,255, 0.65);
 	text-shadow: 1px 1px 1px #000;
 }
+
+
+.labels {
+	color: white;
+	background: black;
+	font-family: "Arial", sans-serif;
+	font-weight: bold;
+	font-size: 10px;
+	white-space: nowrap;
+	padding: 2px;
+	border: 1px dotted white;
+}
--- a/index.php	Wed Mar 12 00:21:46 2014 +0200
+++ b/index.php	Wed Mar 12 01:21:50 2014 +0200
@@ -51,6 +51,7 @@
   </body>
   <script type="text/javascript" src="map.js"></script>
   <script type="text/javascript" src="lib/util.js"></script>
+  <script type="text/javascript" src="lib/markerwithlabel.js"></script>
   <script type="text/javascript" src="lib/markermanager.js"></script>
   <script type="text/javascript" src="continents.js"></script>
   <script type="text/javascript" src="icons.js"></script>
--- a/markers.js	Wed Mar 12 00:21:46 2014 +0200
+++ b/markers.js	Wed Mar 12 01:21:50 2014 +0200
@@ -36,10 +36,15 @@
 
 function pmapCreateMarker(point,name,html,icon,type,continent,mclass)
 {
-  var marker = new google.maps.Marker(
+  var marker = new MarkerWithLabel(
   {
     position: point,
     icon: icon,
+    draggable: false,
+    labelContent: name,
+    labelAnchor: new google.maps.Point(22, 0),
+    labelClass: "labels",
+    labelStyle: {opacity: 0.75}
   });
 
   google.maps.event.addListener(marker, "click", function()