Клуб API Карт

Формирование ссылки на нужный фрагмент карты.

chokoj
26 января 2010, 02:31

Здравствуйте! Столкнулся с проблемой, которую из-за начального уровня знаний решить не в состоянии. По этому очень надеюсь на помощь данного содружества.

Во общем в чем суть... В начале я сделал свою собственную карту ( http://lisichansk.com.ua/y/map_xml.php ),  и прикрутил к ней возможность формировать ссылку на нужный фрагмент карты. Но при вводе ссылок карта не центрируется на заданных координатах и не соответствует масштабу введенному в параметрах ссылки. Чувствую что нужна какая то мелочь, но отсутствие знаний не дает это постигнуть. Ниже собственно говоря ссылка на фрагмент и код карты:

http://lisichansk.com.ua/y/map_xml.php#ll=-179.874161,85.080533&z=15&mt=map&p=-179.874161,85.080533

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Карта с точками пользователей</title>
<script src="http://api-maps.yandex.ru/1.1/index.xml?key=AHGpVUsBAAAAdoWsdQMAxo5xVbUB5_0QpoZXoHmu1y0as58AAAAAAAAAAAC2GV8nnvpEJMVgCDEiWG9KNEx7lg==" type="text/javascript"></script>

<script type="text/javascript">
window.onload = function () {
var options = {
tileUrlTemplate: "./%z/tile-%x-%y.jpg",
controls: {
typeControl: false,
miniMap: false,
toolBar: false,
scaleLine: false


},
scrollZoomEnabled: true,
mapCenter: new YMaps.GeoPoint(-179.875073, 85.080601),
backgroundMapType: YMaps.MapType.NONE,
mapZoom: 13,
isTransparent: true,
smoothZooming: false,
layerKey: "my#layer",
mapType: {
name: "Лисичанск",
textColor: "#ffffff"
},
copyright: ""
},
map = new YMaps.Map(document.getElementById("YMapsID")),
myData = new YMaps.TileDataSource(options.tileUrlTemplate, options.isTransparent, options.smoothZooming);

var s = new YMaps.Style();
s.iconStyle = new YMaps.IconStyle();
s.iconStyle.offset = new YMaps.Point(-12, -12);
s.iconStyle.href = "files/001_06.png";
s.iconStyle.size = new YMaps.Point(16, 16);


map.enableScrollZoom();




myData.getTileUrl = function (tile, zoom) {
return this.getTileUrlTemplate().replace(/%x/i, tile.x).replace(/%y/i, tile.y).replace(/%z/i, zoom);
}

var MyLayer = function () {
return new YMaps.Layer(myData);
}
YMaps.Layers.add(options.layerKey, MyLayer);

var mapLayers = options.backgroundMapType ? options.backgroundMapType.getLayers() : [],
myMapType = new YMaps.MapType(YMaps.jQuery.merge(mapLayers, [ options.layerKey ]), options.mapType.name, { textColor: options.mapType.textColor });

map.setCenter(options.mapCenter, options.mapZoom, myMapType);
if (options.copyright) {
map.addCopyright(options.copyright);
}

if (options.controls.typeControl) {
map.addControl(new YMaps.TypeControl([ myMapType, YMaps.MapType.MAP, YMaps.MapType.SATELLITE, YMaps.MapType.HYBRID ], [1, 2, 3]));
}

if (options.controls.miniMap) {
map.addControl(new YMaps.MiniMap());
}
if (options.controls.toolBar) {
map.addControl(new YMaps.ToolBar());
}
if (options.controls.scaleLine) {
map.addControl(new YMaps.ScaleLine());
}
if (options.scrollZoomEnabled) {
map.enableScrollZoom();
}
map.addControl(new YMaps.Zoom());


var ml = new YMaps.YMapsML( 'http://lisichansk.com.ua/y/point_users.xml' );
map.addOverlay(ml);

YMaps.Events.observe(ml, ml.Events.Fault, function (error) {
alert('Ошибка: ' + error);
});


YMaps.Events.observe(map, map.Events.Click, function (map, mEvent) {
var myHtml = "Значение: " + mEvent.getGeoPoint() + "<br>"+'<form id="formadd" name="formadd_point" method="post" action="outpoint2.php"><p>Название: <input name="namepoint" type="text" size="20" maxlength="80" /></p><p>Описание: <textarea name="descriptpoint" cols="20" rows="5"></textarea></p><input name="pcoord" type="hidden" value="'+mEvent.getGeoPoint()+'" /><p><input name="subpoint" type="submit" value="Добавить" /></p></form>';
map.openBalloon(mEvent.getGeoPoint(), myHtml);
});



// Добавляем метку в центр карты
var placemark = new YMaps.Placemark(map.getCenter(), {draggable: 1, hasBalloon: 0});

// Динамически формируем урл
YMaps.Events.observe(map, [map.Events.Update, map.Events.MoveEnd, map.Events.ChangeType], setUrlParams);
YMaps.Events.observe(placemark, placemark.Events.PositionChange, setUrlParams);

// Функция для формирования параметров в URL'е
function setUrlParams(obj) {
// Включаем установку параметров после загрузки всего скрипта
if (!flagLoad) {
return;
}
document.location.hash = '#ll=' + map.getCenter().toString() +
'&z=' + map.getZoom() +
'&mt=' + map.getType().getLayers().toString() ;
}

var hash = document.location.hash;
if (hash) { // Если строка параметров определена
var hash = hash.substr(1, hash.length - 1).split('&'), // Отрезаем первый символ "#" и
// разбиваем строку на подстроки параметр=значение
params = {}; // Объект будущих параметров

for (var i = 0, l = hash.length, param; i < l; i++) {
param = hash[i].split('='); // Разбиваем параметр на имя и значение
if (param[0] && param[1]) {
params[param[0]] = param[1];
}
}

// Если в урле заданы необходимые параметры
if (params.ll && params.z && params.mt && params.p) {
// Определяем тип карты
var mapType = YMaps.MapType.MAP;
switch (params.mt) {

case 'map':
mapType = YMaps.MapType.MAP;
break;

case 'sat':
mapType = YMaps.MapType.SATELLITE;
break;

case 'hyb':
mapType = YMaps.MapType.HYBRID;
break;
}
// Центрируем карту в нужном месте
map.setCenter(YMaps.GeoPoint(params.ll), params.z, mapType);


}
}

// Скрипт загружен, все параметры из URL'a применены
flagLoad = 1;

}

</script>
</head>
<body>
<div id="YMapsID" style="width:700px;height:400px"></div>
</body>
</html>