Как использовать Google Maps API в листовке-cloudmade

Есть ли способ интегрировать карты Google Maps с помощью буклетов в облаке? То есть, я не хочу использовать исходную облачную карту, но вместо этого хочу использовать Google Maps. Хочу показать карту Аляски (там мало дорог). Если бы я использовал облачную карту, она была бы просто белой.

Вот что я делаю, если хочу использовать облачную карту:

var cloudmade = new L.TileLayer('http://{s}.tile.cloudmade.com/YOUR-API-KEY/997/256/{z}/{x}/{y}.png', {
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>',
    maxZoom: 18
});

Я знаю, что мне нужно изменить 'http: // {s} .tile.cloudmade.com / YOUR-API-KEY / 997/256 / {z} / {x} / {y} .png' часть. Но что мне там писать, если я хочу использовать карту Google (или любую другую карту)?

Это документация для листовки-облака (они не так много говорят об использовании стороннего поставщика карт. Говорят, они не зависят от поставщика карт, используемого в нашем приложении, поэтому я думаю, что можно использовать Google Maps).


person goFrendiAsgard    schedule 17.06.2012    source источник
comment
@dda: Спасибо, что отредактировали мой вопрос.   -  person goFrendiAsgard    schedule 17.06.2012


Ответы (5)


На официальной странице плагинов leaflet.js есть ссылка на Пакет плагинов Павла Шрамова.
Предоставленный Google.js предоставляет вам доступ к плиткам Google Maps с помощью Google Maps API v3 в соответствии с условиями использования.

Вот краткий пример: вы можете использовать его, сначала добавив

<script src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>
<script src="path/to/Google.js"></script>

а затем создайте свою карту:

var map = new L.Map('map', {center: new L.LatLng(43.6481, -79.4042), zoom: 13});
var gmap_layer = new L.Google('ROADMAP');
map.addLayer(gmap_layer);

Примечание. В этой сути также упоминаются некоторые вилки.

person Marius Butuc    schedule 18.02.2013

Google не позволяет вам использовать свои плитки без использования собственного API для их получения. См. Общие условия:

Не злоупотребляйте нашими Сервисами. Например, не ... пытайтесь получить к ним доступ с помощью метода, отличного от интерфейса и инструкций, которые мы предоставляем.

Конечно, все возможно, поэтому можно получить плитки без API, но ваш доступ может быть заблокирован без предупреждения:

Мы можем приостановить или прекратить предоставление вам наших Услуг, если вы не соблюдаете наши условия или политику, или если мы расследуем предполагаемое неправомерное поведение.

Тем не менее, Leaflet API не выглядит очень отличным от Google API, поэтому стоит подумать о преобразовании для использования их API.

person Andrew Leach    schedule 17.06.2012
comment
Привет, я не знал об этом раньше. Спасибо за предоставленную информацию. - person goFrendiAsgard; 17.06.2012

Есть сторонний плагин, который обеспечивает интеграцию Google Maps в Leaflet, чтобы можно было добавить его как слой: http://psha.org.ru/b/leaflet-plugins.html. Однако он действует как прокси для исходного Google Maps API v3, поэтому он не работает так гладко, как простые слои листов Leaflet, и, к сожалению, вы не можете использовать плитки Google Maps напрямую из-за ограничений условий использования (как в ответе выше).

person Mourner    schedule 22.06.2012

На самом деле это не Google Карты, но существует множество различных поставщиков карт LeafLet с примерами кодов, доступных по адресу http://leaflet-extras.github.io/leaflet-providers/preview/

Возможно, вы найдете там поставщика, подходящего для вашей конкретной проблемы. В качестве плюса вы избежите проблем, на которые указал Эндрю Лич. В любом случае - не то чтобы я ожидал, что вы не узнаете, но все же я не хочу упускать это - обратите внимание, что некоторые (но не все) поставщики карт являются коммерческими, и поэтому вам, возможно, придется заплатить за услугу. или может беспокоиться о других TOS.

person Paul Kertscher    schedule 30.08.2013
comment
Спасибо, что сообщили об этом. - person goFrendiAsgard; 31.08.2013

Из этого:

Этот плагин для Debian не имеет этой проблемы, но не соответствует условиям обслуживания Google (Официальный пример).

Или попробуйте этот код:

var map = L.map( 'map' ).setView( [ 51.505, -0.09 ], 13 );

L.tileLayer( '//mt{s}.googleapis.com/vt?x={x}&y={y}&z={z}',
{
  maxZoom: 18,
  subdomains: [ 0, 1, 2, 3 ]
} ).addTo( map );

var marker = L.marker( [ 51.5, -0.09 ] ).addTo( map );
person user3252384    schedule 16.12.2014