var map, map, marker, streetview, panorama, sPano, sHeading, sPitch, sZoom;
jQuery(document).ready(function($) {
// map
var latTextfield = $('#ait-_ait-dir-item-gpsLatitude'); //位置x
var lonTextfield = $('#ait-_ait-dir-item-gpsLongitude'); //位置y
// streetview
var streetviewCheckbox = $('#ait-_ait-dir-item-showStreetview-enable'); //街景是否打开
sPano = $('#ait-_ait-dir-item-streetViewLatitude'); //街景x
//sLongitude = $('#ait-_ait-dir-item-streetViewLongitude'); //街景y
sHeading = $('#ait-_ait-dir-item-streetViewHeading'); //街景 heading
sPitch = $('#ait-_ait-dir-item-streetViewPitch'); //街景 pitch
sZoom = $('#ait-_ait-dir-item-streetViewZoom'); //街景ID Pano
// hide these options
//$('#ait-_ait-dir-item-gpsLatitude-option').hide(); //街景x
//$('#ait-_ait-dir-item-gpsLongitude-option').hide(); //街景y
//$('#ait-_ait-dir-item-streetViewLatitude-option').hide();
//$('#ait-_ait-dir-item-streetViewLongitude-option').hide();
//$('#ait-_ait-dir-item-streetViewHeading-option').hide();
//$('#ait-_ait-dir-item-streetViewPitch-option').hide();
//$('#ait-_ait-dir-item-streetViewZoom-option').hide();
var initLat = (latTextfield.val()&&latTextfield.val()!=0) ? latTextfield.val() : 31.383068;
var initLon = (lonTextfield.val()&&lonTextfield.val()!=0) ? lonTextfield.val() : 120.9707;
var latRow = $('#ait-_ait-dir-item-gpsLatitude-option');
var streetviewCheckboxRow = $('#ait-_ait-dir-item-showStreetview-option');
var mapRow = $('<tr valign="top" id="ait-map-option"><td scope="row" class="ait-custom-fields-label"><label for="ait-map-select">设定位置</label></td><td><div id="ait-map-select" style="width:95%;height:400px;"></div></td></tr>');
var streetviewRow = $('<tr valign="top" id="ait-streetview-option"><td scope="row" class="ait-custom-fields-label"><label for="ait-streetview-select">设定街景 (有些地方可能没有街景照片或街景位置与设定位置较远),你可以转动图片调整视角或点击移动调整位置</label></td><td><div id="ait-streetview-select" style="width:95%;height:400px;"></div></td></tr>');
latRow.before(mapRow); //#ait-map-select地图
streetviewCheckboxRow.after(streetviewRow); //#ait-streetview-select街景
//var initsLat = (sLatitude.val()&&sLatitude.val()!=0) ? parseFloat(sLatitude.val()) : initLat;
var initPano = (sPano.val()&&sPano.val()!= 0) ? sPano.val() : '10121013120927123538500';
//var initsLon = (sLongitude.val()&&sLongitude.val()!=0) ? parseFloat(sLongitude.val()) : initLon;
var initHeading = (sHeading.val()&&sHeading.val()!=0) ? parseFloat(sHeading.val()) : 0;
var initPitch = (sPitch.val()&&sPitch.val()!=0) ? parseFloat(sPitch.val()) : 0;
var initZoom = (sZoom.val()&&sZoom.val()!=0) ? parseInt(sZoom.val()) : 1;
if(initZoom>6){
initZoom = 1;
}
sHeading.val(initHeading);
sPitch.val(initPitch);
sZoom.val(initZoom);
//创建街景
var panorama = new soso.maps.Panorama('ait-streetview-select', { //街景容器
pano:initPano, //场景ID
zoom:initZoom,
pov:{
heading:initHeading,
pitch:initPitch,
},
});
//创建地图实例
var ovc=document.getElementById('ait-map-select');
var overview = new soso.maps.PanoOverview(ovc,{
panorama:panorama
});
var map=overview.getMap();
var pano_service = new soso.maps.PanoramaService();
var center = new soso.maps.LatLng(initLat,initLon);
var marker = new soso.maps.Marker({
map:map,
draggable: true,
position: center
});
/*
var point = marker.position;
var radius;
pano_service.getPano(point, radius, function (result){
panorama.setPano(result.svid);
});
*/
//点击
soso.maps.event.addListener(map, 'click', function (evt){
var point = evt.latLng;
var radius;
marker.setMap(null); //先清标记
map.setCenter(point);
marker = new soso.maps.Marker({
map:map,
draggable: true,
position: point
});
latTextfield.val(point.getLat());
lonTextfield.val(point.getLon());
pano_service.getPano(point, radius, function (result){
panorama.setPano(result.svid);
});
});
//移动
soso.maps.event.addListener(marker, 'dragend', function (evt){
var point = marker.position;
var radius;
map.panTo( point );
latTextfield.val(point.getLat());
lonTextfield.val(point.getLon());
pano_service.getPano(point, radius, function (result){
panorama.setPano(result.svid);
});
})
//改变地名
geocoder = new soso.maps.Geocoder({
complete : function(result){
map.setCenter(result.detail.location);
marker.setMap(null);
marker = new soso.maps.Marker({
map:map,
draggable: true,
position: result.detail.location
});
var point = marker.position;
latTextfield.val(point.getLat());
lonTextfield.val(point.getLng());
var radius;
pano_service.getPano(point, radius, function (result){
panorama.setPano(result.svid);
});
}
});
//街景变化
soso.maps.event.addListener(panorama, 'pov_changed', function (evt){
var vPov=panorama.getPov();
sHeading.val(vPov.heading); //街景 heading
sPitch.val(vPov.pitch); //街景 pitch
})
soso.maps.event.addListener(panorama, 'zoom_changed', function (evt){
sZoom.val(panorama.getZoom());
})
soso.maps.event.addListener(panorama, 'pano_changed', function (evt){
sPano.val(panorama.getPano());
})
// 搜索按钮
var findAddress = $('<a id="find-address-button" href="#" class="button">在地图上搜索此地点</a>');
findAddress.insertAfter('#ait-_ait-dir-item-address');
findAddress.after('<span id="find-address-info-status" style="margin-left: 20px;"></span>');
findAddress.click(function (event) {
event.preventDefault();
var addr = $('#ait-_ait-dir-item-address').val();
if ( !addr || !addr.length ) return;
addr = '江苏省,昆山市,'+addr;
geocoder.getLocation(addr);
});
});
页面显示部分:
jQuery(document).ready(function($) {
smallMapDiv = $(".item-map");
smallMapDiv.width(1000).height(400);
map = new qq.maps.Map(document.getElementById("my-item-map"), {
// 地图的中心地理坐标。
center: new qq.maps.LatLng({ifset $options['gpsLatitude']}{$options['gpsLatitude']}{else}0{/ifset}, {ifset $options['gpsLongitude']}{$options['gpsLongitude']}{else}0{/ifset}),
zoom:16,
});
marker = new soso.maps.Marker({
map:map,
draggable: false,
position: map.center
});
mapDiv = $("#directory-main-bar");
mapDiv.height({!$themeOptions->directoryMap->mapHeight});
{ifset $options['showStreetview']}
streetviewpanorama = new qq.maps.Panorama(document.getElementById('directory-main-bar'), {
pano: {$options['streetViewLatitude']},
zoom: parseInt({$options['streetViewZoom']}),
scrollwheel:false,
visible:true,
pov:{
heading:parseFloat({$options['streetViewHeading']}),
pitch:parseFloat({$options['streetViewPitch']}),
},
});
{/ifset}
});