Отображение авторских прав на карту в GMaps API V3

Question

В настоящее время я переносю приложение из GMaps V2 в V3.Поскольку я использую OSM и другие слои карты, не принадлежащие Google, я хочу оставить уведомление об авторских правах внизу справа.Но справочная документация не дает на это никаких указаний.В V2 авторское право даже имело собственный класс GCopyrightCollection и было передано GTileLayer.Площадка Google Code также не предоставляет пример для V3.

Кто-нибудь знает, как это сделать в новом API?

Answer 1

Список рассылки помог мне в этом вопросе (см. тема ). В коде Google приведен пример кода для коллекций авторских прав и способы их отображения в правом нижнем углу карты DIV.

Поскольку существует проблема с разметкой пользовательского DIV в нижнем правом углу (при переходе на карту перемещается только в правильное положение, проблема самого API GMaps), я теперь отображаю его в левом нижнем углу. ( ОБНОВЛЕНИЕ: Проблема, похоже, исправлена ​​в API!)

Следующий код работает должным образом (конечно, я не использую глобальные переменные, для ясности удален this.):

copyrightDiv = document.createElement("div")
copyrightDiv.id = "map-copyright"
copyrightDiv.style.fontSize = "11px"
copyrightDiv.style.fontFamily = "Arial, sans-serif"
copyrightDiv.style.margin = "0 2px 2px 0"
copyrightDiv.style.whiteSpace = "nowrap"
map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push(copyrightDiv)

copyrights = {}
copyrights["OSM"] = "<a target=\"_blank\" href=\"http://www.openstreetmap.org/\">OpenStreetMap</a>"
copyrights["Osmarender"] = copyrights["OSM"]
copyrights["Cloudmade"] = "<a target=\"_blank\" href=\"http://cloudmade.com/\">CloudMade</a> - Map data <a target=\"_blank\" href=\"http://creativecommons.org/licenses/by-sa/2.0/\">CCBYSA</a>"
copyrights["Cloudmade-Fine"] = copyrights["Cloudmade"]

function onMapTypeIdChanged()
{
    newMapType = map.getMapTypeId()

    copyrightDiv = document.getElementById("map-copyright")
    if(newMapType in copyrights)
        copyrightDiv.innerHTML = copyrights[newMapType]
    else
        copyrightDiv.innerHTML = ""
}

google.maps.event.addListener(map, "maptypeid_changed", onMapTypeIdChanged)

// Call once so that the correct copyright notice is set for
// the initially selected map type
setTimeout(onMapTypeIdChanged, 50)

Answer 2

Решение AndiDog очень вдохновило меня.Но есть некоторый недостаток - авторское право, созданное таким образом, не имеет такой хорошей полупрозрачности стандартного авторского права google .Было бы неудобно создавать его самому, чтобы он поддерживал все браузеры и т. Д., Поэтому я использую другую стратегию - найдите текст «Условия использования» в DOM и поместите свой текст об авторских правах перед ним, в div, созданный Google.Кроме того, я улучшил функцию до , разрешив настраиваемые логотипы , как в мой вопрос здесь :

function gmaps3_copyright(map, copyrights, logos)
{
        var copyrightDiv, logoDiv;
        var google_div__span_created = 0;

        logoDiv = document.createElement("div");
        logoDiv.index = 0; // used for ordering 
        map.controls[google.maps.ControlPosition.BOTTOM_LEFT].push(logoDiv);

        function onMapTypeIdChanged()
        {
                newMapType = map.getMapTypeId()

                if (!google_div__span_created) { // hack into google's div - prefered solution
                        copyrightDiv = document.createElement("span");
                        $(copyrightDiv).insertBefore(
                                $('#mainMap :contains("Terms of Use")')
                                .filter(function() { return $(this).children().length < 1 })
                        );
                        google_div__span_created = 1;
                }

                if (newMapType in copyrights)
                        copyrightDiv.innerHTML = copyrights[newMapType] + ' - '
                else
                        copyrightDiv.innerHTML = ""

                if (newMapType in logos)
                        logoDiv.innerHTML = logos[newMapType]
                else
                        logoDiv.innerHTML = ""

        }

        google.maps.event.addListener(map, "maptypeid_changed", onMapTypeIdChanged);

        // Call once so that the correct copyright notice is set for
        // the initially selected map type
        // but wait until the complete html markup is loaded
        google.maps.event.addListener(map, 'tilesloaded', function () {
                setTimeout(onMapTypeIdChanged, 50);
                // still add some timeout to be 100% sure
        })
}

просто вызовите его так:

gmaps3_copyright(map,
    {
        'OSM': '&copy; <a href="http://www.openstreetmap.org/" target="_blank">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/" target="_blank">CC-BY-SA</a>',
         'Cloudmade' : "<a target=\"_blank\" href=\"http://cloudmade.com/\">CloudMade</a> - Map data <a target=\"_blank\" href=\"http://creativecommons.org/licenses/by-sa/2.0/\">CCBYSA</a>"
    },
    {
         'OSM': // logo html code here
    }
)

Возможно, вам потребуется изменить строку «Условия использования» в соответствии с вашей локализацией.