demah,
Это код страницы с одним маркером:
[GMAP] 1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
<script>
jQuery.noConflict(); jQuery(document).ready(function(){
jQuery("#footer").append('<div id="mapTypeContainer"><div id="mapStyleContainer" class="gradientBorder"><div id="mapStyle"></div></div><div id="mapType" class="roadmap"></div></div>');
jQuery("#gMap").addClass('activeMap').gmap3({
action: 'addMarker',
lat:50.082393,
lng:19.952850,
marker:{
options:{
icon: new google.maps.MarkerImage('http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png')
}
},
map:{
center: true,
zoom: 4 }
},{
action: 'setOptions', args:[{
scrollwheel:true,
disableDefaultUI:false,
disableDoubleClickZoom:false,
draggable:true,
mapTypeControl:true,
mapTypeId:'roadmap',
mapTypeControlOptions: {
position: google.maps.ControlPosition.LEFT_TOP,
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
panControl:false,
scaleControl:false,
streetViewControl:true,
streetViewControlOptions: {
position: google.maps.ControlPosition.RIGHT_CENTER
},
zoomControl:true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.DEFAULT,
position: google.maps.ControlPosition.RIGHT_CENTER
}
}]
});
});
</script>
[/GMAP]
Это код главной с несколькими маркерами:
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
<script type="text/javascript">
//<![CDATA[
jQuery.noConflict(); jQuery(document).ready(function(){
//VAR SETUP
jQuery('#footer').prepend('<div class="markerNav" title="Prev" id="prevMarker"><i class="fa fa-chevron-left"></i></div><div id="markers"></div><div class="markerNav" title="Next" id="nextMarker"><i class="fa fa-chevron-right"></i></div><div id="mapTypeContainer"><div id="mapStyleContainer"><div id="mapStyle" class="satellite"></div></div><div id="mapType" title="Map Type" class="satellite"></div></div>');
jQuery("#gMap").addClass('activeMap').gmap3({
action: 'init',
onces: {
bounds_changed: function(){
var number = 0;
jQuery(this).gmap3({
action:'getBounds',
callback: function (){
add(jQuery(this), number += 1, "Poland", "http://www.discovergalleries.com/poland","","50.082393","19.952850", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); add(jQuery(this), number += 1, "Great wall of chaina Bejjing chaina", "http://www.discovergalleries.com/great-wall-of-chaina-bejjing-chaina","","40.431908","116.570375", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); add(jQuery(this), number += 1, "egypt", "http://www.discovergalleries.com/egypt","","26.820553","30.802498", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); add(jQuery(this), number += 1, "italy", "http://www.discovergalleries.com/italy","","41.871940","12.567380", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); add(jQuery(this), number += 1, "Germany", "http://www.discovergalleries.com/germany","","51.165691","10.451526", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); add(jQuery(this), number += 1, "NewYork", "http://www.discovergalleries.com/newyork","Newyork
U.S.A","40.712784","-74.005941", '','http://www.discovergalleries.com/wp-content/themes/wpnavigator/images/Marker-1.png'); }
});
}
}
},{
action: 'setOptions', args:[{
zoom:2,
scrollwheel:true,
disableDefaultUI:false,
disableDoubleClickZoom:false,
draggable:true,
mapTypeControl:true,
mapTypeId:'roadmap',
mapTypeControlOptions: {
position: google.maps.ControlPosition.LEFT_TOP,
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
panControl:false,
scaleControl:false,
streetViewControl:true,
streetViewControlOptions: {
position: google.maps.ControlPosition.RIGHT_CENTER
},
zoomControl:true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.DEFAULT,
position: google.maps.ControlPosition.RIGHT_CENTER
}
}]
});
function add(jQuerythis, i, title, link, excerpt, lati, longi, img, pin){
jQuerythis.gmap3({
action : 'addMarker',
lat:lati,
lng:longi,
options: {icon: new google.maps.MarkerImage(pin)},
events:{
mouseover: function(marker){
jQuerythis.css({cursor:'pointer'});
jQuery('#markerTitle'+i+'').stop(true,true).fadeIn({ duration: 200, queue: false }).animate({bottom:"32px"},{duration:200,queue:false});
jQuery('.markerInfo').removeClass('activeInfo').hide();
jQuery('#markerInfo'+i+'').addClass('activeInfo').show();
jQuery('.marker').removeClass('activeMarker');
jQuery('#marker'+i+'').addClass('activeMarker');
},
mouseout: function(){
jQuerythis.css({cursor:'default'});
jQuery('#markerTitle'+i+'').stop(true,true).fadeOut(200,function(){jQuery(this).css({bottom:"0"})});
},
click: function(marker){window.location = link}
},
callback: function(marker){
var jQuerybutton = jQuery('<div id="marker'+i+'" class="marker"><div id="markerInfo'+i+'" class="markerInfo"><a class="imgLink" href="'+link+'">'+img+'</a><h2><a href="'+link+'">'+title+'</a></h2><p>'+excerpt+'</p><a class="markerLink" href="'+link+'">View Details →</a><div class="markerTotal">'+i+' / <span></span></div><div class="clear"></div></div></div>');
jQuerybutton.mouseover(function(){
jQuerythis.gmap3({
action:'panTo',
args:[marker.position]
});
jQuery("#target").stop(true,true).fadeIn(500).delay(500).fadeOut(500);
});
jQuery('#markers').append(jQuerybutton);
var numbers = jQuery(".markerInfo").length;
jQuery(".markerTotal span").html(numbers);
if(i == 1){
jQuery('.marker:first-child').addClass('activeMarker').mouseover();
}
jQuerythis.gmap3({
action:'addOverlay',
content: '<div id="markerTitle'+i+'" class="markerTitle">'+title+'</div>',
latLng: marker.getPosition()
});
}
});
}
});
//]]>
</script>
|
