Несколько маркеров, одно информационное окно, привязанное к нижней части карты - PullRequest
Новая
       1

Несколько маркеров, одно информационное окно, привязанное к нижней части карты

0 голосов
/ 22 ноября 2011

У меня проблемы с рендерингом информационного окна карты Google, привязанного несколькими маркерами.

Я использую MVC 3 и javascript для отображения карты, карта отображается нормально, а также окна относительной информации.Но я хочу, чтобы информационное окно отображалось внизу карты, а не относительно маркера.Начальная точка для каждой карты может отличаться в зависимости от страны, использованной для поиска.Мой javascript ниже (который работает)> Я просто не знаю, как изменить информационное окно: 

   function initializeMap() {

var countryID = $("#CountryID :selected").val();
var cityID = $("#cities :selected").val();
var regionID = $("#regions :selected").val();
var locationtypeID = $("#LocationTypeID :selected").val();
var filtertype = $("#filtertype").val();
var latlng;

$.ajax({
    type: "GET",
    url: "/ajaxcalls/getCentre",
    data: "cid=" + countryID,
    datatype: "json",
    success: function (result) {
        var gpscoords = (result).split(",");
        latlng = new google.maps.LatLng(gpscoords[0], gpscoords[1]);
    },
    error: function (req, status, error) {            
    }
});

var myOptions = {
    zoom: 7,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};    

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

$.ajax({
    type: "GET",
    url: "/ajaxcalls/getmarkers",
    data: "cid=" + countryID + "&rid=" + regionID + "&xid=" + cityID + "&tid=" + locationtypeID + "&filterType=" + filtertype,
    datatype: "json",
    success: function (result) {

        var infowindow = null;

        infowindow = new google.maps.InfoWindow({
            content: "holding..."
        });

        $.each(result, function (i, item) {

            var gpscoords = (item.GPSCoOrds.toString()).split(",");

            var mpos = new google.maps.LatLng(gpscoords[1], gpscoords[0]);

            var markerobject = "";

            if (item.LocationTypeID == 2) {
                markerobject = "atm.png";
            }
            else {
                markerobject = "bank.png";
            }

            marker = new google.maps.Marker({
                map: map,
                position: mpos,
                draggable: false,
                icon: "/content/mapicons/" + markerobject,
                title: item.Designation.toString() + " " + item.Address.toString()
            });

            google.maps.event.addListener(marker, 'mouseover', function () {
                var windowcontent = "<div>Site Name: ";
                windowcontent = windowcontent + item.Designation + "</div>";
                windowcontent = windowcontent + "<div>Address: " + item.Address + "</div>";
                windowcontent = windowcontent + "<div>Contact Number: " + item.contactNumber + "</div>";
                windowcontent = windowcontent + "<div>Branch Type: " + item.BranchType + "</div>";
                windowcontent = windowcontent + "<div>Network Provider: " + item.NetworkProvider + "</div>";
                windowcontent = windowcontent + "<div>Network Capacity: " + item.NetworkCapacity + "</div>";

                infowindow.setContent(windowcontent);

                infowindow.open(map, this);
            });
        });
    },
    error: function (req, stats, error) {
        alert(error);
    }
});
    }

   $(document).ready(function () {
        $("#mapupdater").click(function () {
    initializeMap();
});
    });

Любая помощь будет оценена.

1 Ответ

0 голосов
/ 22 ноября 2011

Не привязывайте информационное окно к маркеру с помощью infowindow.open(map, this);

Просто выполните infowindow.open(map);

Однако вам все равно придется сообщить информационному окну, где появиться.Либо используйте атрибут position при его создании, либо setPosition() после его создания.

...