スポンサードリンク

php+MySQL／ストリートビューのマップコネクトのソース

Posted by 管理人 on 2011年10月10日 Leave a comment (1) Go to comments

この記事の中段で動作しているストリートビューのマップコネクトの<script>のソース

  var map_stv;
 
var iconOffset = new google.maps.Point(34, 34); 
var iconPosition = new google.maps.Point(0, 0);
var iconSize = new google.maps.Size(34, 34);
var iconShadowSize = new google.maps.Size(37, 34);

var panUrl = "http://waox.main.jp/maps/gif/bread.png";
var panShadowUrl = "http://waox.main.jp/maps/gif/bread.shadow.png";
var panIcon = new google.maps.MarkerImage(panUrl, iconSize, iconPosition, iconOffset);
var panShadow = new google.maps.MarkerImage(panShadowUrl, iconShadowSize, iconPosition, iconOffset);

var kouenUrl = "http://maps.google.co.jp/mapfiles/ms/icons/tree.png";
var kouenShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/tree.shadow.png";
var kouenIcon = new google.maps.MarkerImage(kouenUrl, iconSize, iconPosition, iconOffset);
var kouenShadow = new google.maps.MarkerImage(kouenShadowUrl, iconShadowSize, iconPosition, iconOffset);

var oyoguUrl = "http://maps.google.co.jp/mapfiles/ms/icons/swimming.png";
var oyoguShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/swimming.shadow.png";
var oyoguIcon = new google.maps.MarkerImage(oyoguUrl, iconSize, iconPosition, iconOffset);
var oyoguShadow = new google.maps.MarkerImage(oyoguShadowUrl, iconShadowSize, iconPosition, iconOffset);

var onsenUrl = "http://maps.google.co.jp/mapfiles/ms/icons/hotsprings.png";
var onsenShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/hotsprings.shadow.png";
var onsenIcon = new google.maps.MarkerImage(onsenUrl, iconSize, iconPosition, iconOffset);
var onsenShadow = new google.maps.MarkerImage(onsenShadowUrl, iconShadowSize, iconPosition, iconOffset);

var temaparkUrl = "http://maps.google.co.jp/mapfiles/ms/icons/motorcycling.png";
var temaparkShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/cycling.shadow.png";
var temaparkIcon = new google.maps.MarkerImage(temaparkUrl, iconSize, iconPosition, iconOffset);
var temaparkShadow = new google.maps.MarkerImage(temaparkShadowUrl, iconShadowSize, iconPosition, iconOffset);

var beachUrl = "http://maps.google.co.jp/mapfiles/ms/icons/water.png";
var beachShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/water.shadow.png";
var beachIcon = new google.maps.MarkerImage(beachUrl, iconSize, iconPosition, iconOffset);
var beachShadow = new google.maps.MarkerImage(beachShadowUrl, iconShadowSize, iconPosition, iconOffset);

var momijiUrl = "http://waox.main.jp/maps/gif/momiji.png";
var momijiShadowUrl = "http://waox.main.jp/maps/gif/momiji.shadow.png";
var momijiIcon = new google.maps.MarkerImage(momijiUrl, iconSize, iconPosition, iconOffset);
var momijiShadow = new google.maps.MarkerImage(momijiShadowUrl, iconShadowSize, iconPosition, iconOffset);

var kidslandUrl = "http://maps.google.co.jp/mapfiles/ms/icons/sportvenue.png";
var kidslandShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/sportvenue.shadow.png";
var kidslandIcon = new google.maps.MarkerImage(kidslandUrl, iconSize, iconPosition, iconOffset);
var kidslandShadow = new google.maps.MarkerImage(kidslandShadowUrl, iconShadowSize, iconPosition, iconOffset);

var suizokukanUrl = "http://maps.google.co.jp/mapfiles/ms/icons/fishing.png";
var suizokukanShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/fishing.shadow.png";
var suizokukanIcon = new google.maps.MarkerImage(suizokukanUrl, iconSize, iconPosition, iconOffset);
var suizokukanShadow = new google.maps.MarkerImage(suizokukanShadowUrl, iconShadowSize, iconPosition, iconOffset);

var doubutsuUrl = "http://maps.google.co.jp/mapfiles/ms/icons/horsebackriding.png";
var doubutsuShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/horsebackriding.shadow.png";
var doubutsuIcon = new google.maps.MarkerImage(doubutsuUrl, iconSize, iconPosition, iconOffset);
var doubutsuShadow = new google.maps.MarkerImage(doubutsuShadowUrl, iconShadowSize, iconPosition, iconOffset);

var outdoorUrl = "http://maps.google.com/mapfiles/kml/pal2/icon4.png";
var outdoorShadowUrl = "http://maps.google.com/mapfiles/kml/pal2/icon4s.png";
var outdoorIcon = new google.maps.MarkerImage(outdoorUrl, iconSize, iconPosition, iconOffset);
var outdoorShadow = new google.maps.MarkerImage(outdoorShadowUrl, iconShadowSize, iconPosition, iconOffset);

var maturiUrl = "http://waox.main.jp/maps/gif/maturi.png";
var maturiShadowUrl = "http://waox.main.jp/maps/gif/maturi.shadow.png";
var maturiIcon = new google.maps.MarkerImage(maturiUrl, iconSize, iconPosition, iconOffset);
var maturiShadow = new google.maps.MarkerImage(maturiShadowUrl, iconShadowSize, iconPosition, iconOffset);

var sakuraUrl = "http://waox.main.jp/maps/gif/sakura.png";
var sakuraShadowUrl = "http://waox.main.jp/maps/gif/sakura.shadow.png";
var sakuraIcon = new google.maps.MarkerImage(sakuraUrl, iconSize, iconPosition, iconOffset);
var sakuraShadow = new google.maps.MarkerImage(sakuraShadowUrl, iconShadowSize, iconPosition, iconOffset);

var kaisuiUrl = "http://maps.google.co.jp/mapfiles/ms/icons/waterfalls.png";
var kaisuiShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/waterfalls.shadow.png";
var kaisuiIcon = new google.maps.MarkerImage(kaisuiUrl, iconSize, iconPosition, iconOffset);
var kaisuiShadow = new google.maps.MarkerImage(kaisuiShadowUrl, iconShadowSize, iconPosition, iconOffset);


var mikakuUrl = "http://waox.main.jp/maps/gif/ichigo.png";
var mikakuShadowUrl = "http://waox.main.jp/maps/gif/ichigo.shadow.png";
var mikakuIcon = new google.maps.MarkerImage(mikakuUrl, iconSize, iconPosition, iconOffset);
var mikakuShadow = new google.maps.MarkerImage(mikakuShadowUrl, iconShadowSize, iconPosition, iconOffset);

var fuyuUrl = "http://maps.google.co.jp/mapfiles/ms/icons/snowflake_simple.png";
var fuyuShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/snowflake_simple.shadow.png";
var fuyuIcon = new google.maps.MarkerImage(fuyuUrl, iconSize, iconPosition, iconOffset);
var fuyuShadow = new google.maps.MarkerImage(fuyuShadowUrl, iconShadowSize, iconPosition, iconOffset);

var bangaUrl = "http://maps.google.co.jp/mapfiles/ms/icons/rangerstation.png";
var bangaShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/rangerstation.shadow.png";
var bangaIcon = new google.maps.MarkerImage(bangaUrl, iconSize, iconPosition, iconOffset);
var bangaShadow = new google.maps.MarkerImage(bangaShadowUrl, iconShadowSize, iconPosition, iconOffset);

var bbqUrl = "http://maps.google.co.jp/mapfiles/ms/icons/firedept.png";
var bbqShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/firedept.shadow.png";
var bbqIcon = new google.maps.MarkerImage(bbqUrl, iconSize, iconPosition, iconOffset);
var bbqShadow = new google.maps.MarkerImage(bbqShadowUrl, iconShadowSize, iconPosition, iconOffset);

var eventUrl = "http://maps.google.com/mapfiles/ms/micons/volcano.png";
var eventShadowUrl = "http://maps.google.com/mapfiles/ms/micons/volcano.shadow.png";
var eventIcon = new google.maps.MarkerImage(eventUrl, iconSize, iconPosition, iconOffset);
var eventShadow = new google.maps.MarkerImage(eventShadowUrl, iconShadowSize, iconPosition, iconOffset);

var hakubutsukanUrl = "http://maps.google.co.jp/mapfiles/ms/icons/info.png";
var hakubutsukanShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/info.shadow.png";
var hakubutsukanIcon = new google.maps.MarkerImage(hakubutsukanUrl, iconSize, iconPosition, iconOffset);
var hakubutsukanShadow = new google.maps.MarkerImage(hakubutsukanShadowUrl, iconShadowSize, iconPosition, iconOffset);

var campingUrl = "http://maps.google.co.jp/mapfiles/ms/icons/campground.png";
var campingShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/campground.shadow.png";
var campingIcon = new google.maps.MarkerImage(campingUrl, iconSize, iconPosition, iconOffset);
var campingShadow = new google.maps.MarkerImage(campingShadowUrl, iconShadowSize, iconPosition, iconOffset);

var drivespotUrl = "http://maps.google.co.jp/mapfiles/ms/icons/cabs.png";
var drivespotShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/cabs.shadow.png";
var drivespotIcon = new google.maps.MarkerImage(drivespotUrl, iconSize, iconPosition, iconOffset);
var drivespotShadow = new google.maps.MarkerImage(drivespotShadowUrl, iconShadowSize, iconPosition, iconOffset);

var kankoUrl = "http://maps.google.com/mapfiles/ms/micons/camera.png";
var kankoShadowUrl = "http://maps.google.com/mapfiles/ms/micons/camera.shadow.png";
var kankoIcon = new google.maps.MarkerImage(kankoUrl, iconSize, iconPosition, iconOffset);
var kankoShadow = new google.maps.MarkerImage(kankoShadowUrl, iconShadowSize, iconPosition, iconOffset);

var restaurantUrl = "http://maps.google.co.jp/mapfiles/ms/icons/restaurant.png";
var restaurantShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/restaurant.shadow.png";
var restaurantIcon = new google.maps.MarkerImage(restaurantUrl, iconSize, iconPosition, iconOffset);
var restaurantShadow = new google.maps.MarkerImage(restaurantShadowUrl, iconShadowSize, iconPosition, iconOffset);

var sweetUrl = "http://waox.main.jp/maps/gif/cake.png";
var sweetShadowUrl = "http://waox.main.jp/maps/gif/cake.shadow.png";
var sweetIcon = new google.maps.MarkerImage(sweetUrl, iconSize, iconPosition, iconOffset);
var sweetShadow = new google.maps.MarkerImage(sweetShadowUrl, iconShadowSize, iconPosition, iconOffset);


var hotelUrl = "http://maps.google.co.jp/mapfiles/ms/icons/homegardenbusiness.png";
var hotelShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/homegardenbusiness.shadow.png";
var hotelIcon = new google.maps.MarkerImage(hotelUrl, iconSize, iconPosition, iconOffset);
var hotelShadow = new google.maps.MarkerImage(hotelShadowUrl, iconShadowSize, iconPosition, iconOffset);

var shopUrl = "http://maps.google.co.jp/mapfiles/ms/icons/convienancestore.png";
var shopShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/convienancestore.shadow.png";
var shopIcon = new google.maps.MarkerImage(shopUrl, iconSize, iconPosition, iconOffset);
var shopShadow = new google.maps.MarkerImage(shopShadowUrl, iconShadowSize, iconPosition, iconOffset);

var outletUrl = "http://maps.google.co.jp/mapfiles/ms/icons/shopping.png";
var outletShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/shopping.shadow.png";
var outletIcon = new google.maps.MarkerImage(outletUrl, iconSize, iconPosition, iconOffset);
var outletShadow = new google.maps.MarkerImage(outletShadowUrl, iconShadowSize, iconPosition, iconOffset);

var moviesUrl = "http://maps.google.com/mapfiles/ms/micons/movies.png";
var moviesShadowUrl = "http://maps.google.com/mapfiles/ms/micons/movies.shadow.png";
var moviesIcon = new google.maps.MarkerImage(moviesUrl, iconSize, iconPosition, iconOffset);
var moviesShadow = new google.maps.MarkerImage(moviesShadowUrl, iconShadowSize, iconPosition, iconOffset);

var dogUrl = "http://waox.main.jp/maps/gif/dog.png";
var dogShadowUrl = "http://waox.main.jp/maps/gif/dog.shadow.png";
var dogIcon = new google.maps.MarkerImage(dogUrl, iconSize, iconPosition, iconOffset);
var dogShadow = new google.maps.MarkerImage(dogShadowUrl, iconShadowSize, iconPosition, iconOffset);

var kadenUrl = "http://maps.google.com/mapfiles/ms/micons/electronics.png";
var kadenShadowUrl = "http://maps.google.com/mapfiles/ms/micons/electronics.shadow.png";
var kadenIcon = new google.maps.MarkerImage(kadenUrl, iconSize, iconPosition, iconOffset);
var kadenShadow = new google.maps.MarkerImage(kadenShadowUrl, iconShadowSize, iconPosition, iconOffset);

var cameraUrl = "http://maps.google.com/mapfiles/ms/micons/webcam.png";
var cameraShadowUrl = "http://maps.google.com/mapfiles/ms/micons/webcam.shadow.png";
var cameraIcon = new google.maps.MarkerImage(cameraUrl, iconSize, iconPosition, iconOffset);
var cameraShadow = new google.maps.MarkerImage(cameraShadowUrl, iconShadowSize, iconPosition, iconOffset);

var skiUrl = "http://maps.google.com/mapfiles/ms/micons/ski.png";
var skiShadowUrl = "http://maps.google.com/mapfiles/ms/micons/ski.shadow.png";
var skiIcon = new google.maps.MarkerImage(skiUrl, iconSize, iconPosition, iconOffset);
var skiShadow = new google.maps.MarkerImage(skiShadowUrl, iconShadowSize, iconPosition, iconOffset);

var railUrl = "http://maps.google.com/mapfiles/ms/micons/rail.png";
var railShadowUrl = "http://maps.google.com/mapfiles/ms/micons/rail.shadow.png";
var railIcon = new google.maps.MarkerImage(railUrl, iconSize, iconPosition, iconOffset);
var railShadow = new google.maps.MarkerImage(railShadowUrl, iconShadowSize, iconPosition, iconOffset);

var parkingUrl = "http://maps.google.co.jp/mapfiles/ms/icons/parkinglot.png";
var parkingShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/parkinglot.shadow.png";
var parkingIcon = new google.maps.MarkerImage(parkingUrl, iconSize, iconPosition, iconOffset);
var parkingShadow = new google.maps.MarkerImage(parkingShadowUrl, iconShadowSize, iconPosition, iconOffset);

var dateUrl = "http://waox.main.jp/maps/gif/heart.png";
var dateShadowUrl = "http://waox.main.jp/maps/gif/heart.shadow.png";
var dateIcon = new google.maps.MarkerImage(dateUrl, iconSize, iconPosition, iconOffset);
var dateShadow = new google.maps.MarkerImage(dateShadowUrl, iconShadowSize, iconPosition, iconOffset);

var airportUrl = "http://maps.google.com/mapfiles/ms/micons/plane.png";
var airportShadowUrl = "http://maps.google.com/mapfiles/ms/micons/plane.shadow.png";
var airportIcon = new google.maps.MarkerImage(airportUrl, iconSize, iconPosition, iconOffset);
var airportShadow = new google.maps.MarkerImage(airportShadowUrl, iconShadowSize, iconPosition, iconOffset);

var airplaneUrl = "http://maps.google.co.jp/mapfiles/ms/icons/helicopter.png";
var airplaneShadowUrl = "http://maps.google.co.jp/mapfiles/ms/icons/helicopter.shadow.png";
var airplaneIcon = new google.maps.MarkerImage(airplaneUrl, iconSize, iconPosition, iconOffset);
var airplaneShadow = new google.maps.MarkerImage(airplaneShadowUrl, iconShadowSize, iconPosition, iconOffset);

var dolphinUrl = "http://waox.main.jp/kaigai/icon/dolphin.png";
var dolphinShadowUrl = "http://waox.main.jp/kaigai/icon/dolphin.shadow.png";
var dolphinIcon = new google.maps.MarkerImage(dolphinUrl, iconSize, iconPosition, iconOffset);
var dolphinShadow = new google.maps.MarkerImage(dolphinShadowUrl, iconShadowSize, iconPosition, iconOffset);

var whaleUrl = "http://waox.main.jp/kaigai/icon/whale.png";
var whaleShadowUrl = "http://waox.main.jp/kaigai/icon/dolphin.shadow.png";
var whaleIcon = new google.maps.MarkerImage(whaleUrl, iconSize, iconPosition, iconOffset);
var whaleShadow = new google.maps.MarkerImage(whaleShadowUrl, iconShadowSize, iconPosition, iconOffset);

var artUrl = "http://waox.main.jp/kaigai/icon/art.image.png";
var artShadowUrl = "http://waox.main.jp/kaigai/icon/art.shadow.png";
var artIcon = new google.maps.MarkerImage(artUrl, iconSize, iconPosition, iconOffset);
var artShadow = new google.maps.MarkerImage(artShadowUrl, iconShadowSize, iconPosition, iconOffset);

var keshikiUrl = "http://maps.google.com/mapfiles/kml/pal4/icon46.png";
var keshikiShadowUrl = "http://maps.google.com/mapfiles/kml/pal4/icon46s.png";
var keshikiIcon = new google.maps.MarkerImage(keshikiUrl, iconSize, iconPosition, iconOffset);
var keshikiShadow = new google.maps.MarkerImage(keshikiShadowUrl, iconShadowSize, iconPosition, iconOffset);

var scubaUrl = "http://waox.main.jp/kaigai/icon/scuba.png";
var scubaShadowUrl = "http://waox.main.jp/kaigai/icon/scuba.shadow.png";
var scubaIcon = new google.maps.MarkerImage(scubaUrl, iconSize, iconPosition, iconOffset);
var scubaShadow = new google.maps.MarkerImage(scubaShadowUrl, iconShadowSize, iconPosition, iconOffset);

var snorkelingUrl = "http://waox.main.jp/kaigai/icon/nemo2.png";
var snorkelingShadowUrl = "http://waox.main.jp/kaigai/icon/nemo.shadow.png";
var snorkelingIcon = new google.maps.MarkerImage(snorkelingUrl, iconSize, iconPosition, iconOffset);
var snorkelingShadow = new google.maps.MarkerImage(snorkelingShadowUrl, iconShadowSize, iconPosition, iconOffset);

var santaUrl = "http://waox.main.jp/maps/gif/santa.png";
var santaShadowUrl = "http://waox.main.jp/maps/gif/santa.shadow.png";
var santaIcon = new google.maps.MarkerImage(santaUrl, iconSize, iconPosition, iconOffset);
var santaShadow = new google.maps.MarkerImage(santaShadowUrl, iconShadowSize, iconPosition, iconOffset);


	var scustomIcons = 
	{
		pan:
		{
		icon:panIcon,
		shadow:panShadow
		},
		kouen:
		{
		icon:kouenIcon,
		shadow:kouenShadow
		},
		oyogu: 
		{
		icon:oyoguIcon,
		shadow:oyoguShadow
		},     
		temapark: {
		icon:temaparkIcon,
		shadow:temaparkShadow
		},   
		kidsland: {
		icon:kidslandIcon,
		shadow:kidslandShadow
		},   
		beach: 
		{
		icon:beachIcon,
		shadow:beachShadow
		},      
		suizokukan: 
		{
		icon:suizokukanIcon,
		shadow:suizokukanShadow
		},      
		onsen: 
		{
		icon:onsenIcon,
		shadow:onsenShadow
 		},      
		doubutsu: 
		{
		icon:doubutsuIcon,
		shadow:doubutsuShadow
		},      
		outdoor: 
		{
		icon:outdoorIcon,
		shadow:outdoorShadow
		},      
		maturi: 
		{
		icon:maturiIcon,
		shadow:maturiShadow
		},      
		sakura: 
		{
		icon:sakuraIcon,
		shadow:sakuraShadow
		},      
		momiji: 
		{
		icon:momijiIcon,
		shadow:momijiShadow
		},      
		kaisui: 
		{
		icon:kaisuiIcon,
		shadow:kaisuiShadow
		},      
		mikaku: 
		{
		icon:mikakuIcon,
		shadow:mikakuShadow
		},      
		fuyu: 
		{
		icon:fuyuIcon,
		shadow:fuyuShadow
		},      
		banga: 
		{
		icon:bangaIcon,
		shadow:bangaShadow
		},      
		bbq: 
		{
		icon:bbqIcon,
		shadow:bbqShadow
		},      
		event: 
		{
		icon:eventIcon,
		shadow:eventShadow
		},      
		hakubutsukan: 
		{
		icon:hakubutsukanIcon,
		shadow:hakubutsukanShadow
		},      
		camping: 
		{
		icon:campingIcon,
		shadow:campingShadow
		},      
		drivespot: 
		{
		icon:drivespotIcon,
		shadow:drivespotShadow
		},      
		kanko: 
		{

		icon:kankoIcon,
		shadow:kankoShadow
		},      
		restaurant: 
		{
		icon:restaurantIcon,
		shadow:restaurantShadow
		},      
		sweet: 
		{
		icon:sweetIcon,
		shadow:sweetShadow
		},      
		hotel: 
		{
		icon:hotelIcon,
		shadow:hotelShadow
		},      
		shop: 
		{
		icon:shopIcon,
		shadow:shopShadow
		},      
		outlet: 
		{
		icon:outletIcon,
		shadow:outletShadow
		},  
		movies: 
		{
		icon:moviesIcon,
		shadow:moviesShadow
		},  
		dog: 
		{
		icon:dogIcon,
		shadow:dogShadow
		},  
		kaden: 
		{
		icon:kadenIcon,
		shadow:kadenShadow
		},  
		camera: 
		{
		icon:cameraIcon,
		shadow:cameraShadow
		},      
		ski: 
		{
		icon:skiIcon,
		shadow:skiShadow
		},        
		rail: 
		{
		icon:railIcon,
		shadow:railShadow
		},    
		date: 
		{
		icon:dateIcon,
		shadow:dateShadow
		},    
		santa: 
		{
		icon:santaIcon,
		shadow:santaShadow
		}, 
		airport: 
		{
		icon:airportIcon,
		shadow:airportShadow
		}, 
		airplane: 
		{
		icon:airplaneIcon,
		shadow:airplaneShadow
		}, 
		dolphin: 
		{
		icon:dolphinIcon,
		shadow:dolphinShadow
		}, 
		whale: 
		{
		icon:whaleIcon,
		shadow:whaleShadow
		}, 
		art: 
		{
		icon:artIcon,
		shadow:artShadow
		}, 
		keshiki: 
		{
		icon:keshikiIcon,
		shadow:keshikiShadow
		}, 
		scuba: 
		{
		icon:scubaIcon,
		shadow:scubaShadow
		}, 		
		snorkeling: 
		{
		icon:snorkelingIcon,
		shadow:snorkelingShadow
		}, 
		parking: 
		{
		icon:parkingIcon,
		shadow:parkingShadow
		} 
	};


google.load('search','1'); 
function sHomeControl(controlDiv, map_stv) 
　　　　{
 

  controlDiv.style.padding = '5px';
 

  var controlUI = document.createElement('DIV');
  controlUI.style.backgroundColor = 'white';
  controlUI.style.borderStyle = 'solid';
  controlUI.style.borderWidth = '2px';
  controlUI.style.cursor = 'pointer';
  controlUI.style.textAlign = 'center';
  controlUI.title = 'Click to set the map to Home';
  controlDiv.appendChild(controlUI);
 

  var controlText = document.createElement('DIV');
  controlText.style.fontFamily = 'Arial,sans-serif';
  controlText.style.fontSize = '13px';
  controlText.style.paddingLeft = '4px';
  controlText.style.paddingRight = '4px';
  controlText.innerHTML = '<b>Where is street view icon?</b>';
  controlUI.appendChild(controlText);
 
 
	google.maps.event.addDomListener(controlUI, 'click', function() 
	{
	map_stv.setCenter(positionCell);
	//map_stv.setZoom(12);
	//map_stv.setMapTypeId('satellite');
	});
}

var StreetViewOptions = 
{
	getTileUrl: function(coord, zoom) 
	{
	var X = coord.x % (1 << zoom);
	return "http://cbk0.google.com/cbk?output=overlay&" + 
	"zoom=" + zoom + "&x=" + X + "&y=" + coord.y + "&cb_client=api";
	},
	tileSize: new google.maps.Size(256, 256),
	isPng: true
};

var StreetViewType = new google.maps.ImageMapType(StreetViewOptions);

function sinitialize() 
{
var myOptions = 
　　　　{


		navigationControl: true,
		navigationControlOptions: 
		{
		style: google.maps.NavigationControlStyle.DEFAULT,
		position: google.maps.ControlPosition.LEFT_TOP

		},

		mapTypeControl: true,
		mapTypeControlOptions: 
		{
		//style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
		//style: google.maps.MapTypeControlStyle.DEFAULT,
		style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
		position: google.maps.ControlPosition.TOP_RIGHT
		},

		scaleControl: true,
		scaleControlOptions: 
		{

		position: google.maps.ControlPosition.TOP_CENTER
		},

　　　　zoom: szoom,
　　　　center: scenter,
　　　　mapTypeId: smapTypeId
　　　　};


　　　　sgbarOptions=
　　　　{
     　　// we're going with the defaults
　　　　};

　　　　map_stv = new google.maps.Map(document.getElementById("map_street"), myOptions);
	map_stv.overlayMapTypes.insertAt(0, StreetViewType);

　　　　var gbar=new window.jeremy.jGoogleBar(map_stv,sgbarOptions) 
　　　　map_stv.controls[google.maps.ControlPosition.BOTTOM_LEFT].push(gbar.container); 


	var homeControlDiv = document.createElement('DIV');
	var homeControl = new sHomeControl(homeControlDiv, map_stv);
	homeControlDiv.index = 1;
	map_stv.controls[google.maps.ControlPosition.RIGHT_TOP].push(homeControlDiv);


	google.maps.event.addListener(map_stv, 'dragstart', function() 
	{
	hidepostcard_stv() ;
	hideinfocard_stv();
	//return false;
	});


	google.maps.event.addListener(map_stv, 'idle', function() 	{
	scenter = map_stv.getCenter();
	ssearchLocationsNear(); 


		if (document.getElementById("spano").checked == true)
		{
		sloadPhotos();
		}

	});    

　
	var panoramaOptions = 
	{
	position:povCenter,
		pov: 
		{
		heading: povHeading,
		pitch:povPitch,
		zoom:povZoom		}
	};
	var panorama = new  google.maps.StreetViewPanorama(document.getElementById("panowide"),panoramaOptions);
	map_stv.setStreetView(panorama);

	//◆ペグマン位置変更イベント
	google.maps.event.addListener(panorama, 'position_changed', function() 
	{
	positionCell = panorama.getPosition();
	map_stv.panTo(positionCell);//◆ペグマンの座標へ移動
	});

} 


var smarkers = [];
var spanoramios = [];

function ssearchLocationsNear() 
{


var szoom =  map_stv.getZoom();

　　if (szoom >= 1 && szoom <= 8) {var view = '0';}  
　　else if(szoom ==9){var view = '85';}
　　else if(szoom ==10){var view = '43';}
　　else if(szoom ==11){var view = '25';}
　　else if(szoom ==12){var view = '16';}
　　else if(szoom ==13){var view = '8';}
　　else if(szoom ==14){var view = '4';}
　　else if(szoom ==15){var view = '2';}
　　else if(szoom ==16){var view = '1';}
　　else if(szoom ==17){var view = '0.7';}
　　else if(szoom ==18){var view = '0.5';}
　　else if(szoom ==19){var view = '0.3';}
　　else if(szoom ==20){var view = '0.1';}
　　else {var view = '0';}

var radius = view;

 
	var url = 'http://waox.main.jp/world/php/world.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
	downloadUrl(url, function(data) 
	{
		var xml = parseXml(data);
		var smarkerNodes = xml.documentElement.getElementsByTagName("marker");

		var new_smarkers = [];

		for (var i = 0; i < smarkerNodes.length; i++) 
		{
		var sname = smarkerNodes[i].getAttribute("name");
		scategory = smarkerNodes[i].getAttribute("category");
		var distance = parseFloat(smarkerNodes[i].getAttribute("distance"));
		var latlng = new google.maps.LatLng(
			parseFloat(smarkerNodes[i].getAttribute("lat")),
			parseFloat(smarkerNodes[i].getAttribute("lng")));
		var explanation = smarkerNodes[i].getAttribute("explanation");
		var linkurl = smarkerNodes[i].getAttribute("linkurl");
		var icon = scustomIcons[scategory] || {};
		
		var html = '<b>'+sname+'</b><br>'+"(中心から" + distance.toFixed(1) + "km)" ;

			if (latlng in smarkers)
			{
			new_smarkers[latlng] = smarkers[latlng];
			} 
			else 
			{ 					

				var smarker = new google.maps.Marker(
				{
				map: map_stv,
             			position: latlng,
            			 icon: icon.icon,
            			 shadow: icon.shadow,
            			 title: sname
            			 });
			sbindInfoWindow(smarker, map_stv, sname, html,linkurl,explanation,latlng)
 			new_smarkers[latlng] = smarker;
			}
	
		}

		for (var latlng in smarkers) 
		{
			if (!(latlng in new_smarkers)) 
			{
			smarkers[latlng].setMap(null);
			delete smarkers[latlng];
			}
		}
	smarkers = new_smarkers;
	});
 }


function downloadUrl(url, callback) 
{
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
 
	request.onreadystatechange = function(data) 
	{
		 if (request.readyState == 4) 
		{
		request.onreadystatechange = doNothing;
		callback(request.responseText, request.status);
		}
	};
 	 request.open('GET', url, true);
	request.send(null);
}

function parseXml(str) 
{
	if (window.ActiveXObject) 
	{
	var doc = new ActiveXObject('Microsoft.XMLDOM');
	doc.loadXML(str);
	return doc;
	} 
	else if (window.DOMParser) 
	{
	return (new DOMParser).parseFromString(str, 'text/xml');
	}
}
 
function doNothing() {}

 

function sbindInfoWindow(smarker, map_stv, sname, html,linkurl,explanation,latlng,distance) 
{

	google.maps.event.addListener(smarker, 'click', function() 
	{ 
		function toggleBounce () 
		{
			if (smarker.getAnimation() != null) 
			{
			smarker.setAnimation(null);
			}	 
			else 
			{            
			smarker.setAnimation(google.maps.Animation.BOUNCE);
			}
		} 
 		toggleBounce();
		showinfocard_stv(sname,linkurl,explanation,map_stv,smarker,html,distance);
		setTimeout(toggleBounce, 3000);
		map_stv.panTo(latlng);
		hidepostcard_stv();
	});
}

function showinfocard_stv(sname,linkurl,explanation,map_stv,smarker,html,total) 
{

document.getElementById("sname").innerHTML = sname;
document.getElementById("slinkurl").innerHTML = linkurl;
document.getElementById("sexplanation").innerHTML = explanation;
//document.getElementById("shtml").innerHTML = html;
//document.getElementById("stotal").innerHTML =  "(" + total.toFixed(1) + "km)";
document.getElementById('infocard_stv').style.display = 'block';
}

function hideinfocard_stv() 
{
document.getElementById('infocard_stv').style.display = 'none';

}

  
function sloadPhotos() {
	var url = 'http://www.panoramio.com/map/get_panoramas.php?order=popularity&set=public&from=0&to=20&size=mini_square&callback=saddPhotos';
	var bounds = map_stv.getBounds();
	url += '&minx=' + bounds.getSouthWest().lng().toFixed(6) + '&miny=' + bounds.getSouthWest().lat().toFixed(6);
	url += '&maxx=' + bounds.getNorthEast().lng().toFixed(6) + '&maxy=' + bounds.getNorthEast().lat().toFixed(6);
	url += '&ts=' + new Date().getTime(); // prevent caching


    var script = document.createElement("script");
    script.setAttribute("src", url);
    script.setAttribute("type", "text/javascript");                
    document.body.appendChild(script);
}


function saddPhotos(data) {
	var new_spanoramios = [];

	if (data.photos && data.photos.length) {
		for (var i = 0; i < data.photos.length; i++) {
			var sphoto = data.photos[i]; 
		
			if (sphoto.photo_id in spanoramios) {
				new_spanoramios[sphoto.photo_id] = spanoramios[sphoto.photo_id];
			
			} else {
				// create new smarker
				var photo_latlng = new google.maps.LatLng(sphoto.latitude, sphoto.longitude),

				panoramio = new google.maps.Marker({
					position: photo_latlng,
					icon: sphoto.photo_file_url,
					map: map_stv
				});

				saddClickHandler(panoramio, sphoto,photo_latlng);
				new_spanoramios[sphoto.photo_id] = panoramio;
			}
		}
	}


	for (var photo_id in spanoramios) {
		if (!(photo_id in new_spanoramios)) {
			spanoramios[photo_id].setMap(null);
			delete spanoramios[photo_id];
		}
	}

	spanoramios = new_spanoramios;
}

function saddClickHandler(panoramio, sphoto,photo_latlng) {
	google.maps.event.addListener(panoramio, 'click', function() {
		showpostcard_stv(sphoto);
		hideinfocard_stv();
		map_stv.panTo(photo_latlng);
	});
}

function showpostcard_stv(sphoto) {
	document.getElementById('postcard_stv').style.display = 'block';
	document.getElementById('sphoto_title').innerHTML = sphoto.photo_title;
	document.getElementById('sphoto_url').href = sphoto.photo_url;
	document.getElementById('sphoto_file_url').src = 'http://mw2.google.com/mw-panoramio/photos/small/' + sphoto.photo_id + '.jpg';


}
function hidepostcard_stv() {
	document.getElementById('postcard_stv').style.display = 'none';
}

google.setOnLoadCallback(sinitialize);

関連記事一覧

スポンサードリンク

関連記事一覧

  1. マーカー（アイコン）の種類、画像、サイズ、位置、影を変更する／Google Maps API V3 （new google.maps.Marker / new google.maps.MarkerImage)
  2. 外部XMLファイルでなく内部ソースにマーカー用の配列を記述する。
  3. ストリートビュー地図（マップコネクト）の外にペグマンの表示位置を切り替えるボタンを設置する
  4. Google Street View（ストリートビュー）のConnecting MapにMarkerを表示させるサンプルデモ（Demo）
  5. PHP+MySQL（XMLファイル生成）+Google Maps API V3／地図表示サンプル
Related Posts
Google Maps API v3, ストリートビュー（streetView）, , ,

Leave a Comment


NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <img localsrc="" alt="">

Trackbacks and Pingbacks: