2009-07-17 2 views
23

Есть ли способ захватить изображение Карты Google? Я не могу использовать статическую карту, потому что у меня есть свои собственные полилинии на карте, и я хочу их в «скриншоте».Карт Google Maps?

В принципе, я хочу, чтобы пользователь перемещался по карте, добавлял несколько полилиний, а когда он нажимал «Сохранить», я сохраняю линии, координаты, масштабирование, но мне также хотелось бы, чтобы изображение представлялось в виде миниатюры в списках ,

Tks заранее.

+4

Я только что узнал, что статическая карта также может рисовать линии. Очки отправляются через URL-адрес. Например. ? HTTP: //maps.google.com/staticmap центр = 52.09259895866942,4.310945570468903 и увеличение = 17 & размер = 300x200 & MapType = спутник & ключ = 12345 & = формат JPG и путь = RGBA: 0xff0000ff, вес: 5 | 52.09254128161833,4.309733211994171 | 52.092371545864,4.309856593608856 | 52.092503379515605,4.31052178144455 | 52.092661579383304,4.310438632965088 Это все еще не решение, потому что, если у меня есть 50 очков, которые будут нарисованы в строках, я получу огромный URL-адрес, который не будет принят. Любые другие идеи? – Dante

+0

50 очков на статической карте не так уж много. У вас есть 8K, чтобы играть по этому URL-адресу, так что держитесь! –

+0

здесь [snashotcontrol 2.0] (http://code.google.com/p/snapshotcontrol/) – Timeless

ответ

17

Масасьте Кацумат пришел с Snapshot Control, что делает снимок Карт Google с путем на него и создает изображение из него.

+1

Я думаю, что это «официальное» решение проблемы. – Kensai

+0

Хотя он позволяет легко экспортировать полигоны, он все еще использует статическую карту api. Если вы хотите получить карту, как вы ее нарисовали, сохранение холста также является допустимым методом (см. Мой ответ) – Arkiliknam

2

Вы можете использовать ThinkGeo Map Suite. Они поддерживают рендеринг изображений с Google, Yahoo или MS Карта услуг, в то время как вы можете сделать ваши поли линии и т.д. на этой карте ...

Работа с их Map Suite V3 кусок пирога

+1

Посмотрите на него. Tks для наконечника. – Dante

0

Не может сделайте это с API карт, как упоминалось выше, но Yahoo предлагает один, и это довольно безболезненно.

Yahoo: Map Image API

+0

сервис удален 13 сентября 2011 г. –

8

Использование Google Maps Content вне службы является нарушением Условий использования API Карт Google использования, так что, хотя существуют методы для создания моментальных снимков, Google не дайте вам разрешение на это.

Для обеспечения законченных целей вам необходимо использовать статические карты (возможно, с уменьшенным содержанием, особенно если пользователь использует MSIE, где максимальная длина URL-адреса довольно мала) или небольшие реальные Карты Google.

У меня пока нет прав для добавления или изменения комментариев к вопросу, поэтому я остановлюсь на том, что ограничение по URL-адресу, по крайней мере, на некоторых совместимых с Картой версиях MSIE, составляет 2083 символа, а не 8k, как это в большинстве других браузеров.

+0

Tks для предупреждения;) – Dante

+0

Не проблема, хотя, если пользователь использует реальную карту Google для создания скриншота в первую очередь. – NickG

+0

Вы получите ошибку 400 от серверов Google, если URL-адрес превышает ограничение на размер URL-адреса 2048 символов. Неважно, какой браузер вы используете. – Codezilla

3

Если вы хотите сохранить больше, чем google maps, то статический API позволяет (например, настраивать наложения, наложенные на него слишком сложные/большие, чтобы проходить через последовательность запросов), вы можете экспортировать контейнер карты в холст, используя что-то вроде html2Canvas (http://html2canvas.hertzen.com/), затем преобразуйте его в URL-адрес данных и сделайте с ним, как хотите.

function saveMapToDataUrl() { 

    var element = $("#mapDiv"); 

    html2canvas(element, { 
     useCORS: true, 
     onrendered: function(canvas) { 
      var dataUrl= canvas.toDataURL("image/png"); 

      // DO SOMETHING WITH THE DATAURL 
      // Eg. write it to the page 
      document.write('<img src="' + dataUrl + '"/>'); 
     } 
    }); 
} 

Я считаю, что вам нужно установить для параметра useCORS значение true, чтобы функция могла загружать изображения из Google.

Недостатком этого подхода является то, что он может оставить вас с мегабайтом данных, сидящих на вашей странице.

Я попытался использовать этот подход для ЭКСПОРТА карты для загрузки изображения, но столкнулся с проблемами в том, как получить этот образ человеку в приятной усадьбе. Вы можете использовать гиперссылку, у которой есть атрибут href, установленный для созданного вами dataUrl, но имя файла не может быть установлено, если вы не используете атрибуты HTML, такие как download = "filename.png", что для меня было проблематично для разных браузеров. Другой подход заключается в том, чтобы отправить dataUrl на сервер для сервера, чтобы затем выложить его, как это необходимо, но загрузка большого изображения только для его загрузки снова кажется странным способом справиться с этим.

+0

Спасибо за опцию useCORS, использовал тот же html2canvas lib, но изображение карты не поступало должным образом, с опцией useCORS он поступал так, как предполагалось – shivgre

Смежные вопросы