Здравствуйте! Делаю каталог организаций на SOBI2. Решил поставить карту, но карты яндекса и Google не устраивают тем что нет прорисовки нужных мне посёлков. Наткнулся на проект Open street map - то что надо, искомые объекты там прорисованы, а если нет то можно обрисовать самому. Вообщем далее с помощью Угольникова Сергея -  webmap-blog.ru (http://webmap-blog.ru) отобразил карту со слоем OSM. Сначала меняем код showGoogleMaps из файла
entry.functions.php на:
Код:
                                                                     
function showGoogleMaps($mySobi, $config)
    {

if( !$config->useGoogleMaps) {
return null;
}

$title = $config->jsAddSlashes( $mySobi->title );
$GeoPos = $config->getGeoPosition( $mySobi->id );
if( $GeoPos['lat'] && $GeoPos['long'] && is_numeric( $GeoPos['lat'] ) && is_numeric( $GeoPos['lat'] ) ) {
?>
<div style="width: <?php echo $config->googleMapsWidth; ?>px; height: <?php echo $config->googleMapsHeight; ?>px;" id="sobi2GoogleMaps"></div>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
//<![CDATA[

function initialize() {
var myLatlng = new Google.maps.LatLng(<?php echo $GeoPos['lat']; ?>, <?php echo $GeoPos['long']; ?>);

var myOptions = {
zoom: <?php echo $config->googleMapsZoom; ?>,
center: myLatlng,
mapTypeControl: false,
navigationControl: true,
navigationControlOptions: {style: Google.maps.NavigationControlStyle.SMALL},
mapTypeId: Google.maps.MapTypeId.ROADMAP     
}
var map = new Google.maps.Map(document.getElementById("sobi2GoogleMaps"), myOptions);

// Задаем слой с OSM
 
var openStreet = new Google.maps.ImageMapType({
  getTileUrl: function(ll, z) {
var X = ll.x % (1 << z);  // wrap
return "http://tile.openstreetmap.org/" + z + "/" + X + "/" + ll.y + ".png";
  },
  tileSize: new Google.maps.Size(256, 256),
  isPng: true,
  maxZoom: 18,
  name: "OSM",
  alt: "Слой с Open Streetmap"
});
 
//Добавляем слои к карте
 
map.mapTypes.set('osm', openStreet);
map.setMapTypeId('osm');

map.setOptions({
  mapTypeControlOptions: {
mapTypeIds: [
  'osm',
  Google.maps.MapTypeId.ROADMAP,
  Google.maps.MapTypeId.TERRAIN,
  Google.maps.MapTypeId.SATELLITE,
  Google.maps.MapTypeId.HYBRID
],
style: Google.maps.MapTypeControlStyle.DROPDOWN_MENU
  }
});

var marker = new Google.maps.Marker({
position: myLatlng,
map: map,
title:"<?php echo _SOBI2_GOOGLEMAPS_LABEL; ?>"
});


}

                 Google.maps.event.addDomListener(window,'load', initialize);

//]]>
</script>
<?php
}
elseif ((strlen(trim($GeoPos['lat'])) && strlen(trim($GeoPos['long']))) && (!is_numeric($GeoPos['lat']) || !is_numeric($GeoPos['lat']))) {
trigger_error("HTML_SOBI::showGoogleMaps(): Given cooordinates ({$GeoPos['lat']}, {$GeoPos['long']}) are not correct. Please enter float values");
}
    }
    function waySearchUrl( $waySearchLink )
    {
$config =& sobi2Config::getInstance();
if($config->useWaySearch) {
echo $waySearchLink;
}
    }
}

Далее добавляем поле field_fetchcoordinates в менеджере полей (тип поля text_code) и вставляем туда код:
Код:
                                                                     
                                                                     
                                                                     
                                             
<script src="http://maps.google.com/maps?file=api&v=1&key={googleApiKey}" type="text/javascript"></script>;
 
<div id="map" style="width: 400px; height: 300px"></div>
 
<script type="text/javascript">
    //<![CDATA[
 
    var start_latitude = "52.4777619318499";
    var start_longitude = "-1.89788818359375";
    var zoomlevel_add = 11;
    var zoomlevel_edit = 3;
 
    var map = new GMap(document.getElementById("map"));
    map.addControl(new GSmallMapControl());

//Custom function for fetchng tiles from OSM server
CustomGetTileUrl=function(a,b){
return 'http://a.tile.openstreetmap.org/'+b+'/'+a.x+'/'+a.y+'.png';
}

var copyright = new GCopyright(1,

new GLatLngBounds(new GLatLng(53.8136257,-3.0981445),

new GLatLng(53.8654855,-2.9663944) ), 17, "");

var copyrightCollection = new GCopyrightCollection('');

copyrightCollection.addCopyright(copyright);


var tilelayers = [new GTileLayer(copyrightCollection,1,17)];

tilelayers[0].getTileUrl = CustomGetTileUrl;


var osmmap = new GMapType(tilelayers, G_SATELLITE_MAP.getProjection(), "OSM");

map.addMapType(osmmap);
 
  var latitude = document.getElementById('field_latitude').value;
  if (latitude == "")
    latitude = start_latitude;
  var longitude = document.getElementById('field_longitude').value;
  if (longitude == "")
    longitude = start_longitude;
  if (latitude == start_latitude)
     zoomlevel = zoomlevel_add;
  else
     zoomlevel = zoomlevel_edit;
 
    // center and zoom to the lat/long in the form
    map.setCenter(new GLatLng(longitude,latitude), zoomlevel, osmmap);
 
    GEvent.addListener(map, 'click',
        function(overlay, point) {
            if (point) {
                document.getElementById('field_latitude').value = point.y;
                document.getElementById('field_longitude').value = point.x;
            }
        }
    );   
//]]>
</script>
Теперь создаём поля "широта (field_latitude)" "Долгота (field_longitude)". И пробуем!

Данный скрипт я позже немного модифицировал, теперь в форме добавления при выборе посёлка карта автоматически отображает это посёлок.

Добавить комментарий


Защитный код
Обновить