علامات متعددة على خريطة Google

StackOverflow https://stackoverflow.com/questions/606515

سؤال

أضفت خريطة Google مع علامتين (أنا فقط اختبار) ، الرمز هو:

function load() {

    var map = new GMap2(document.getElementById("map"));


    var marker = new GMarker(new GLatLng(<%=coordinates%>));
    var marker2 = new GMarker(new GLatLng(31.977211,35.951729));
    var html="<%=maptitle%><br/>" +
         "<%=text%>";
    var html2="<img src='simplemap_logo.jpg' width='20' height='20'/> " +
         "<%=maptitle%><br/>" +
         "<%=text%>" + "Alper";
    map.setCenter(new GLatLng(<%=coordinates%>), 5);
    map.setMapType(G_HYBRID_MAP);
    map.addOverlay(marker);
    map.addOverlay(marker2);
    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());


    marker.openInfoWindowHtml(html);
    marker2.openInfoWindowHtml(html2);
    }

المشكلة هي أن نص علامة واحد فقط يظهر (المثلث الأبيض مع نص بداخله) والآخر غير مرئي ، لماذا؟ شيء آخر ، لدي جدول من الخرائط ، يشبه: mapid ، mapcoordinates ، mapmarkertitle ، mapmarkertext ، يمكنني استرداد هذا الجدول ، لكنني أريد طريقة لأتمكن لدي في طاولتي ، أعرف أن هذا اثنان كثيرًا ، لكن هل يمكن لأي شخص أن يقترح أو يساعدني في الرمز؟ كما لا أعرف شيئًا عن JavaScript: D

إخراج HTML هو:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
    Untitled Page
</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAANgu3GlobW5KtQorgXrnJ_xTHM4EYhrvsce8mdg4KdiCoPfCQKxSOZ_5sjy4O31twg6cxfZqam24TCw"
      type="text/javascript"></script>

    <script type="text/javascript">

     function load() {

    var map = new GMap2(document.getElementById("map"));


    var marker = new GMarker(new GLatLng(32.523251,35.816068));
    var marker2 = new GMarker(new GLatLng(31.977211,35.951729));
    var html="maen<br/>" +
         " maen tamemi";
    var html2="<img src='simplemap_logo.jpg' width='20' height='20'/> " +
         "maen<br/>" +
         " maen tamemi" + "Alper";
    map.setCenter(new GLatLng(32.523251,35.816068), 5);
    map.setMapType(G_HYBRID_MAP);
    map.addOverlay(marker);
    map.addOverlay(marker2);
    map.addControl(new GLargeMapControl());
    map.addControl(new GScaleControl());
    map.addControl(new GMapTypeControl());



    marker2.openInfoWindowHtml(html2);
    marker.openInfoWindowHtml(html);
    }

    //]]>
    </script>

    <script type="text/javascript">

      function pageLoad() {
      }

    </script>

</head>
<body onload = "load()">
    <form name="form1" method="post" action="Xhome.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNDI5NDcxNTY4ZGTjxbb38769ZB2N9Ow9kAzPz2PIqA==" />
</div>

    <div id="map" style="width:400px;height:300px" >

    </div>
    </form>
</body>
</html>
هل كانت مفيدة؟

المحلول

ردا على الجزء الثاني من سؤالك:

أريد طريقة لتكون قادرًا على تمرير جميع سجلاتها إلى JavaScript وإنشاء علامة لكل خريطة لدي في طاولتي

لدي (كمثال - مكتوب منذ عام أو نحو ذلك) الرمز التالي:

في الكود-لدي شيء من هذا القبيل (C# أخشى):

[WebMethod]
public LatitudeLogitudeMessage[] GetPoints(string postCodes)
{
    string[] postCodeArray = postCodes.Split(",".ToCharArray());

    LatitudeLogitudeMessage[] pointArray = 
                   new LatitudeLogitudeMessage[postCodeArray.Length];
    int index = 0;
    foreach (string postCode in postCodeArray)
    {
        pointArray[index] = GetPoint(postCode);
        index++;
    }

    return pointArray;
}

LatituDeLogituDemessage هو فئة مخصصة تبدو مثل:

public class LatitudeLogitudeMessage
{
    public decimal? Latitude { get; set; }
    public decimal? Longitude { get; set; }
    public string Message { get; set; }
    public string Details { get; set; }
    public string Address { get; set; }

    public LatitudeLogitudeMessage(string addressToFind)
    {
        Address = addressToFind;
        Details = addressToFind.Replace(",", ",<br />");
    }
}

تملأ طريقة GetPoint Bascally هذه التفاصيل.

في الكود أمامني بعد ذلك:

PageMethods.GetPoints(address, showPoints);

الذي يدعو طريقة GetPoints على الكود وراء ، ويمرر النتيجة إلى نقاط العرض:

function showPoints(latLongs)
{
  GLog.write("Showing points");
  var points = [];
  var latLngBounds = new GLatLngBounds();

  for (var i = 0; i < latLongs.length; i++)
  {
    if ("" == latLongs[i].Message)
    {
      points[i] = new GLatLng(latLongs[i].Latitude, latLongs[i].Longitude);
      var marker = 
            new GMarker(points[i], {title: latLongs[i].Details, clickable: false});
      map.addOverlay(marker);
      latLngBounds.extend(points[i]);
    }
    else
    {
      GLog.write(latLongs[i].Message);
    }
  }

  if (points.length > 1)
  {
    var bounds = new GBounds(points);
    var center = new GLatLng(
         (latLngBounds.getSouthWest().lat() 
           + latLngBounds.getNorthEast().lat()) /2.,
         (latLngBounds.getSouthWest().lng() 
           + latLngBounds.getNorthEast().lng()) /2.);
    var newZoom = map.getBoundsZoomLevel(latLngBounds, map.getSize());
    map.setCenter(center, newZoom);
  }
  else
  {
    map.setCenter(points[0], defaultZoomLevel);
  }
}

لذلك يأخذ هذا مجموعة النقاط ، ويتكرر عليها إنشاء علامة كما تتوافق ، حيث تركز على العنصر الأول في القائمة (ليس ذكيًا ، لكنه نجح بالنسبة لي).

نصائح أخرى

جرب ال MARKER MANGARE API, ، من الأسهل التعامل معها. إليك مثال Google:

function setupMap() {
 if (GBrowserIsCompatible()) {
   map = new GMap2(document.getElementById("map"));
   map.addControl(new GLargeMapControl());
   map.setCenter(new GLatLng(41, -98), 4);
   window.setTimeout(setupWeatherMarkers, 0);
 }
}

function getWeatherMarkers(n) {
  var batch = [];
  for (var i = 0; i < n; ++i) {
    batch.push(new GMarker(getRandomPoint(), 
      { icon: getWeatherIcon() }));
  }
  return batch;
}

function setupWeatherMarkers() {
  mgr = new GMarkerManager(map);
  mgr.addMarkers(getWeatherMarkers(20), 3);
  mgr.addMarkers(getWeatherMarkers(200), 6);
  mgr.addMarkers(getWeatherMarkers(1000), 8);
  mgr.refresh();
}

لا أعتقد أن خرائط Google يمكن أن تعرض أكثر من نافذة معلومات واحدة في كل مرة ، لذلك عندما تفتح الثانية ، تغلق أول واحدة.

يحرر: لا تفتح العلامات أيضًا تلقائيًا نافذة المعلومات تلقائيًا عند النقر فوقها. تحتاج إلى إرفاق معالج النقر بالعلامة التي تستدعي طريقة showInfowIndOwHtml. يمكنني استخدام وظيفة المساعد التي تنشئ علامة وتضيف معالج النقر تلقائيًا.

function createMarkerHtml(point, title, html) {
    var marker = new GMarker(point, { title: title });
    GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(html); });
    return marker;
}

map.addOverlay(createMarkerHtml(new GLatLng(<%=coordinates%>), "Marker 1", html));
map.addOverlay(createMarkerHtml(new GLatLng(31.977211,35.951729), "Marker 2", html2));
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top