Создание карты покрытия?

Question

[ArtZl]

Подскажите каким образом можно создать карту покрытия наподобие:
www.yota.ru/ru/coverage/russia/
moscow.megafon.ru/help/coverage/

Answer 1

[forgotten]

И у Яндекса есть: https://github.com/yandex/mapsapi-heatmap

Comments

[Антон Корзунов]

Даже два - jsfiddle.net/UkD3C

Answer 2

[Vitaliy Petrychuk]

Посмотрел как делает Мегафон. Йота думаю использует похожий подход.
map.megafonmoscow.ru/ — пример карты без лишних скриптов
map.megafonmoscow.ru/i/4g081012/z10/618_321.png — фрагмент зоны покрытия. Таких картинок грузится несколько штук (они определяется координатами крайних точек карты, которые видны на экране).
В зависимости от зума карты подгружаются и разные картинки (..., z10, z9, z8,… в URL)
А дальше просто изображение накладывается на карту средствами Ядрекс.API :)
Не знаю как именно т.к. не работал с этими картами, но в GoogleMaps для подобных манипуляций есть Layers.

Comments

[Павел Тысляцкий]

По сути это еще один тайловый слой поверх обычной карты.

[ArtZl]

Спасибо за объяснение!
Попробую глянуть GoogleMaps

У многих операторов так реализована карта покрытия, но нигде не смог найти информацию по реализации

[Павел Тысляцкий]

Зачем смотреть как в гугло картах, если Вам нужны яндекс карты:
Код первого Вашего примера: http://www.yota.ru/js/y.coverage-map.js:

var myData_lte = new YMaps.TileDataSource("/images/y.coverage/tiles-lte", true, false);
var myData_wimax = new YMaps.TileDataSource("/images/y.coverage/tiles", true, false);

myData_lte.getTileUrl = function (tile, zoom) {
	if ((zoom > minzoom) && is_tile_in_bounds($bound_zones, zoom, tile)) {
	  return this.getTileUrlTemplate() + "/" + zoom + "/" + tile.x + "-" + tile.y + ".png?" + update_date;
	}
}

myData_wimax.getTileUrl = function (tile, zoom) {
    if ((zoom > minzoom) && is_tile_in_bounds($bound_zones, zoom, tile)) {
      return this.getTileUrlTemplate() + "/" + zoom + "/" + tile.x + "-" + tile.y + ".png?" + update_date;
    }
}

var layer_lte = new YMaps.Layer(myData_lte);
var layer_wimax = new YMaps.Layer(myData_wimax);

YMaps.Layers.add("coverage#layer_lte", layer_lte);
YMaps.Layers.add("coverage#layer_wimax", layer_wimax);

var layer_lte   = new YMaps.MapType(["coverage#layer_lte"], "LTE");
var layer_wimax = new YMaps.MapType(["coverage#layer_wimax"], "WiMax");

Здесь добавляются два слоя которые отдают тайлы по "/images/y.coverage/tiles/{{zoom}}/{{x}}-{{y}}.png" и "/images/y.coverage/tiles-lte/{{zoom}}/{{x}}-{{y}}.png"

Другими словами:
1. читаем о слоях
2. пишем свои тайлы покрытия
3. добавляем выдачу тайлов на сервер
4. добавляем слой на карту с Вашими тайлами

[ArtZl]

Большое спасибо

Answer 3

[Павел Тысляцкий]

Если Вам достаточно точечного покрытия с разной силой, то можно посмотреть в сторону heat map, например, как здась (для яндекса реализации нет, но по примерам видимо это не турдно сделать).