Как использовать API Карт Google в листах-облачных таблицах

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

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

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="#" onclick="location.href='http://openstreetmap.org'; return false;">OpenStreetMap</a> contributors, <a href="#" onclick="location.href='http://creativecommons.org/licenses/by-sa/2.0/'; return false;">CC-BY-SA</a>, Imagery © <a href="#" onclick="location.href='http://cloudmade.com'; return false;">CloudMade</a>',
    maxZoom: 18
});

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

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

Ответ 1

Страница плагинов Официальная страница плагинов adslet.js ссылается на пакет Плагины Павла Шрамова. Предоставленный Google.js предоставляет вам доступ к плитам Карт Google с помощью API Карт Google 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);

Примечание: есть также некоторые вилки, упомянутые в этом значении.

Ответ 2

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

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

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

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

При этом API-интерфейс Leaflet не сильно отличается от API Google, поэтому конверсия для использования их API вполне может быть рассмотрена.

Ответ 3

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

Ответ 4

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

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

Ответ 5

Из этого:

Этот плагин для 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 );