@

@

@

ΰÑ@‚Ö@@@@@@@»ÝÌßÙÍß°¼Þ@@Google Maps 16@@google_maps16.htm

˜A”Ô•t‚«E”zFŽ©—R‚̶½Àϲ½ÞÏ°¶°‚ðGoogle Maps API»°ÊÞ°‚©‚çŽæ“¾B@@@@@@Google Maps APIADHTMLB@@@@@@”zFA‚«o‚µ‚Ȃǂ̶½Àϲ½Þ‚Í÷½Ä´ÃÞ¨À°‚ȂǂʼnÂB@@@@all ‘ΉžB@@@@@ºËß°A•ÒW‚µAŠÈ’P‚ÉWeb‚ʼnž—p‚Å‚«‚Ü‚ÁA(^ ^)B @@@@@@@ŠÖ˜Aî•ñ F VhŽü•Óº°Ë° -2@½À°ÊÞ¯¸½@“Œ‹ž“s“àÊÞ½˜Hü@‘S‘“S“¹˜Hü@‘S‘ÀÞÑϯÌß@‘S‘ŒöŽ¦’n‰¿Ï¯Ìß@“ú–{•S–¼ŽR@”’’n}@Ü‚êü‹——£‚Æ–ÊÏ@¢ŠE‚Ì‘X

ÃÞÓ‚ÍAÏ°¶°‚Ìϳ½µ°ÊÞ°AÏ°¶°‚̸د¸Aî•ñWiniʲÊß°Øݸ•t‚«j‚ðÎ߯Ìß±¯ÌßB@@ ϳ½‚̽¸Û°Ù‚ŽްÑA‚Ü‚½ÄÞׯ¸ÞˆÚ“®‚È‚Ç‚ðIB

@

< ‚²Žg—p•û–@ >

@E@Û°¶Ùi=PCj‚Ö‚Ì•Û‘¶‚ÍAgoogle_maps16/ ‚ð¸Ø¯¸ŠJ‚¢‚½ÎÙÀÞ°‚ÅAgoogle_maps16.htmA0077114410.js ‚ð‰E¸Ø¯¸A[‘ÎÛ‚ð̧²Ù‚É•Û‘¶] - y̧²Ù‚ÌÀÞ³ÝÛ°ÄÞzAy̧²Ù–¼‚ð•t‚¯‚Ä•Û‘¶z - <•Û‘¶‚·‚éêŠ>F ccA‚È‚Ç‚ÅB@@@@¦:  •Ï‚í‚Á‚Ä‚µ‚Ü‚Á‚½A̧²Ù–¼‚âA*.html ’†‚ÌÊß½‚Í—vC³B

@E@‚±‚ÌDHTML‚ÌŽÀ‘••û–@‚ÍAgoogle_maps16.htm ‚ð÷½Ä´ÃÞ¨À°‚ÅŠJ‚«AΰÑÍß°¼Þ쬿ÌÄ‚È‚Ç‚ÌHTML‘}“ü/•ÒWÒÆ­°‚È‚Ç‚ðŽg‚Á‚ÄAV‚µ‚¢Íß°¼Þ 1 ‚â hogehoge.htmli=”CˆÓ‚Ì‘}“üæ̧²Ù–¼j ‚ÌA <head>@`@</head> ‚Ì”CˆÓ‚ÌsŠÔ‚É (*1)‚ðA‚³‚ç‚É <body>@`@</body>‚Ì”CˆÓ‚ÌsŠÔ‚É (*2) ‚ðÍß°½Ä‚µ‚Ü‚·B

@¥@•ÒW•û–@‚ÍAhogehoge.html ‚ð WordPad ‚â SmipleText‚È‚Ç‚Ì÷½Ä´ÃÞ¨À°A‚ ‚é‚¢‚Í hFrontPage Expressh ‚È‚Ç‚ÌΰÑÍß°¼Þ§ì¿ÌÄ‚ÌHTMLÀ¸Þ‘}“ü/•ÒWÒÆ­° ‚ÅŠJ‚«•ÒW‚µ‚Ü‚·B@@@@‰º‹L‚Ìi—áj (*1) ‚ÆA(*2)A(*3) ‚ðŽQl‚É‘¾Žš•”•ª‚Ì•ÒW‚ð”CˆÓ‚És‚¢‚Ü‚·B@@@ @¦: ÷½Ä´ÃÞ¨À°‚É‚æ‚é•ÒW‚ÍAHP§ì¿ÌĂƂ̌݊·«‚Ì–â‘è‚𶂶‚Ü‚¹‚ñiHP§ì¿ÌÄŠÔ‚Í­‚µ¶‚¶‚éjB

@E@쓮ýĂÍAÛ°¶ÙiPCj‚É•Û‘¶‚µA Internet Explorer 10.x` ‚È‚Ç‚ÅŠJ‚¢‚ÄB@@@@ XV‚ÌŠm”F‚ÍA[F5]·° ‚ð‰Ÿ‚µAÅVÃÞ°À“Ç‚Ýž‚ÝA‚ÅB@@@@‚ ‚é‚¢‚ÍAInternet Explorer‚ð‘S‚ĕ‚¶AÄ‹N“®‚ðs‚¢A‰{———š—ð‚Ì휌ã‚âAyInternet Explorerz- [°Ù] - [²ÝÀ°È¯Ä µÌß¼®Ý] - [‰{——‚Ì—š—ð] - [íœ] ‚È‚Ç‚Å‚àB

@¥@±¯ÌßÛ°ÄÞ‚â쓮ýĂÍAhogehoge.html ‚Æ“¯‚¶ŠK‘wkÎÙÀÞ°/ÃÞ¨Ú¸ÄØ°l‚ÉAŽg—p‚·‚é‰æ‘œA*.js ‚È‚Ç‚à“]‘—/”z’u‚µŽÀŽ{B@@¦F•ÊÃÞ¨Ú¸ÄØ°‚É”z’uŽž‚ÍA*.html ’†‚ÌÊß½‚Í—vC³B@@@FTP‚È‚Ç‚Å•Ï‚í‚Á‚Ä‚µ‚Ü‚Á‚½Ì§²Ù–¼‚Í—vC³B@@@@½¸ØÌßÄ\•¶’†‚ւ̉üs¬“ü‚Í”ñì“®Œ´ˆöB

@¥@ŠÖ˜Aî•ñ F F‹L†5AV6A½À²Ù¼°ÄØ̧ÚݽAΰÑÍß°¼ÞŠJÝ“ü–åB@@@Web DevelopmentAWebŠJ”­AIE10 ŒÝŠ·«¸¯¸ÌÞ¯¸AVŠJ”­ŽÒŒü‚¯¶Þ²ÄÞAIE API Ø̧ÚݽAIE ŠJ”­ > HTML‚ÆCSSAŠJ”­Â°Ù‚Å»²Ä‚ðC³A½¸ØÌßÄ ÃÞÊÞ¯¸Þ‚ÌŠT—vAHTML‚ÆCSS‚Ì»Îß°ÄACSS‚̉ü—Ç“_AXMLAVØ̧ÚݽADHTMLB

@

(*1) F@google_maps16.htm i—áj@@@@@@@@@‘}“üæ‚Ì @<head> ` </head>@‚ÌA` •”•ª‚ÉÍß°½Ä‚µ‚Ü‚·B

@HTML‚Ì•ÒW•û–@@  (*1) ‚ð÷½Ä´ÃÞ¨À°‚ÅŠJ‚«A‰º‹L«‚ÌHTML‚ð‘}“üæ̧²Ù‚ÉÍß°½ÄA‘¾Žš•”•ª‚ð•ÒW‚µŽg—pB
k‚±‚Ì—ñÍß°½Ä•s—vl  @

¼ÌÄJISŽg—pi휕s‰Âj

ie‚È‚Ç‚É•\Ž¦‚·‚é±²ºÝ̧²Ù–¼i휉Âj

<style type= `  </style>‚Íi휉Âj
(*1)`(*3)•\À²ÄÙ”wŒi
body •¶ŽšF@”wŒiF@‰ºü
ʲÊß°Øݸ V
•\Ž¦Ï‚Ý‚ÌV
ϳ½µ°ÊÞ°Žž‚ÌV
¸Ø¯¸’†‚ÌV
Ì«ÝÄ

Øݸ‚ðV‚µ‚¢Win‚ÅŠJ‚­‚ð•W€i휉Âj¦Ftarget=@‚¢‚ë‚¢‚ë
“¯‚¶ÌÚ°Ñ=_selfAÍß°¼Þ‘S‘Ì=_topAeÌÚ°Ñ=_parent
‚¨‹C‚É“ü‚èAÀ½¸ÊÞ°‚É•\Ž¦‚·‚éÍß°¼Þ–¼i‚̧²Ù–¼j

@

—]”’

@

ϯÌß‚‚³

@

@

@

@

ͯÀÞ°

@


Google Maps API KeyiŒÂ•Êj

@

À•W@‚«o‚µ@Î߯Ìß±¯ÌßÒ¯¾°¼Þ@ʲÊß°Øݸ@»²Ä–¼

ˆÈ‰ºA“¯—lB

@

@

<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">

<link REL="SHORTCUT ICON" href="favicon.ico">

<style type="text/css"><!--
.xxx0 { background: #F9F8F9 url('wttec.gif'); }
.xxx1 { background-color:#E3E0DC; }
.xxx2 { background-color:#FFF; }
body { color:#000000; background: #F9F8F9 url('wttec.gif'); text-decoration:none; }
a:link { color:#3C0055; background-color:#FBFAFE; text-decoration:none; }
a:visited { color:#270037; background-color:#EDECEF; text-decoration:none; }
a:hover { color:#1F002E; background-color:#D2F3F4; text-decoration:underline; }
a:active { color:#1F002E; background-color:#F5FFD2; text-decoration:underline; }
font {font-size:12px; line-height:13px;}
body,tr,td,form{ font-family:MS PGothic,MS Gothic,Verdana; font-size: 12px}
 --></style>

<base target="_blank">

<title>ƒTƒ“ƒvƒ‹ƒy[ƒW@@Google Maps 16</title>

<!--@™ -----------@« ‚±‚ÌŠÔ‚ðƒRƒs[•ƒy[ƒXƒg‚µ‚Ü‚·B ------------@-->
<style type="text/css"><!--
html, body {
height: 100%;
margin: 10;
padding: 0;
}

#gmap_canvas {
height: 100%;
}

@media print {
html, body {
height: auto;
}

#gmap_canvas {
height: 100%;
}
}
 #header {position: absolute; top: 0px; left: 1px; width:100%; margin:2px; padding: 0px; text-align: left; color:#2E0064; background: #FFF url('http://www@cc@/bg_slva3r.jpg');border-left: 1px solid #F0F0F4; border-top: 1px solid #F0F0F4; border-right: 1px solid #E2E2E7; border-bottom: 1px solid #E2E2E7;; font-style:normal; font-variant:normal; font-weight:normal; font-size:13px; font-family:Lucida Console;color:#2E0064;"}

--></style>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIz@cc@gPQ3E&sensor=false"></script>
<script type="text/javascript">

function initialize(id){
var data = new Array();
@@ @@ // ˆÜ“x@@@@@@@Œo“x@
@@ @@ //@‚«o‚µ@@Î߯Ìß±¯Ìßî•ñk÷½Ä@URL@ʲÊß°Øݸl@
data.push({position: new google.maps.LatLng(35.69057759024401, 139.70196361501027), title: '’Ö‰®àÛàè“X', content: '’Ö‰®àÛàè“X Vh’ƒ—¾<a href=\'http://www.@cc@/tabid/224/Default.aspx\'>@Ë@™ WebSaite</a>'});
data.push({position: new google.maps.LatLng(35.69213079936511, 139.70269116420556), title: '¯”TàÛàè“X', content: '¯”TàÛàè“X<a href=\'http://www@cc@\'>@Ë@™ WebSaite</a>'});

====  ‚±‚ÌŠÔ¤à–¾‚ðÈ—ª¡  ====

data.push({position: new google.maps.LatLng(35.66382529493989,139.69995439052582), title: 'g’ƒ‚Ì“X¹ÆÔÝ', content: 'g’ƒ‚Ì“X¹ÆÔÝ<a href=\'http://kenyan.co.jp/\'>@Ë@™ WebSaite</a>'});
data.push({position: new google.maps.LatLng(35.67896034380629,139.7105759382248), title: 'ÏÝӽè°', content: 'ÏÝӽè°-<a href=\'http://www.monmouth.jp/jingu.html\'>@Ë@™ WebSaite</a>'});
var map = viewGoogleMap(id,null,data,true);
}

</script>
<script type="text/javascript" src="0077114410.js"></script>
<!--@™ -----------@ª ‚±‚ÌŠÔ‚ðƒRƒs[•ƒy[ƒXƒg‚µ‚Ü‚·B ------------@-->
</head>

====  ‚±‚ÌŠÔ¤à–¾‚ðÈ—ª¡  ====

@

@

(*2) F@google_maps16.htm i—áj@@@@@@@@‘}“üæ‚Ì @<body> ` </body>@‚ÌA` •”•ª‚ÉÍß°½Ä‚µ‚Ü‚·B

@HTML‚Ì•ÒW•û–@@  (*2)‚ð÷½Ä´ÃÞ¨À°‚ÅŠJ‚«A‰º‹L«‚ÌHTML‚ð‘}“üæ̧²Ù‚ÉÍß°½ÄA‘¾Žš•”•ª‚ð•ÒW‚µŽg—pB
k‚±‚Ì—ñÍß°½Ä•s—vl

@

ͯÀÞ°

JavaScript

À²ÄÙ

@

@

<body onload="initialize('gmap_canvas')">

<DIV id="header">@<img align="absmiddle" border="0" src="doutor.jpg" width="23" height="23" title="iKÞKj">@<b>ƒR[ƒq[Eg’ƒEƒpƒ“iVhŽü•Ój</b>@@@@Ï°¶°‚ð¸Ø¯¸Aî•ñWin‚ðÎ߯Ìß±¯ÌßB@@@@<a target="_blank" href="https://maps.google.co.jp/maps?q=Vh ƒZƒKƒtƒŒ[ƒhEƒUƒlƒbƒeƒB" title="Google Maps ‚‹@”\”Å‚ðAV‚µ‚¢Win‚ŵ°ÌßÝIB@ˆÈ‰ºA“¯—lB">Segafredo ZANETTI</a>A<a target="_blank" href="https://maps.google.co.jp/maps?q=Vh ƒhƒg[ƒ‹ƒR[ƒq[">ÄÞÄ°Ùº°Ë°</a>A<a target="_blank" href="https://maps.google.co.jp/maps?q=Vh ƒXƒ^[ƒoƒbƒNƒX">½À°ÊÞ¯¸½</a>A<a target="_blank" href="https://maps.google.co.jp/maps?q=Vh º°Ë°">Vh º°Ë°</a>iGoogle MapŒŸõj@@@¦:<a target="_blank" href="google_maps16as.htm">•ÒW•û–@</a>
</DIV><br/>
<!--@š@------ª‚ÌAonload="initialize('gmap_canvas')" ‚Æ@« ‚±‚ÌŠÔ‚ðƒRƒs[•ƒy[ƒXƒg‚µ‚Ü‚·B ------------@-->
<div id="gmap_canvas"></div>
<!--@š@-----------@ª ‚±‚ÌŠÔ‚ðƒRƒs[•ƒy[ƒXƒg‚µ‚Ü‚·B ------------@-->

====  ‚±‚ÌŠÔ¤à–¾‚ðÈ—ª¡  ====

@

(*3) F@0077114410.js i—áj@@@@@@@@@÷½Ä´ÃÞ¨À°‚ÅŠJ‚«A•ÒW‚µhogehoge.html‚Æ“¯ÃÞ¨Ú¸ÄØ°‚É“]‘—E”z’u‚µ‚Ü‚·B@

@ @*.js ‚Ì•ÒW•û–@@  (*3)‚ð÷½Ä´ÃÞ¨À°‚ÅŠJ‚«A‰º‹L«‚Ì‘¾Žš•”•ª‚ð•ÒW‚µŽg—pB
@ k‚±‚Ì—ñÍß°½Ä•s—vl

@

@

@

@

@

@

@

Ï°¶°”wŒiF@”Ô†F

@

@

@

@

@

½Þ°Ñ
ϯÌß’†S‚ÌÀ•W

@

@

/**
* GoogleMap‚Ì•\Ž¦
* @param {String} id •\Ž¦—̈æID
* @param {Object} option google.maps.Map‚ÉÝ’è‚·‚éƒIƒvƒVƒ‡ƒ“
* @param {Object} markerArray ƒ}[ƒJ[ƒf[ƒ^”z—ñ
* @param {Object} isNumberPin ”Ô†•t‚«ƒ}[ƒJ[‚Å•\Ž¦‚·‚é‚©
*/
var viewGoogleMap = function(id, option, markerArray, isNumberPin){
/**
* ƒ}[ƒJ[‚̃NƒŠƒbƒNƒCƒxƒ“ƒgƒŠƒXƒi[‚Ì“o˜^
* @param {google.maps.Marker} marker ƒ}[ƒJ[ƒIƒuƒWƒFƒNƒg
* @param {Object} markerData ƒ}[ƒJ[‚ÉÝ’è‚·‚éî•ñƒEƒBƒ“ƒhƒEƒf[ƒ^
*/

====  ‚±‚ÌŠÔ¤à–¾‚ðÈ—ª¡  ====

title: makerArray[i].title,
map: gmap,
icon: isNumberPin ? new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld="+ (i + 1) + "|00D7CB|000000") : null,
shadow:isNumberPin ? new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",null,null, new google.maps.Point(12, 35) ) : null
});

// ƒ}[ƒJ[‚ÌclickƒŠƒXƒi[“o˜^
 setMarkerClickListener(marker, makerArray[i], true);
}
};

option = option ? option : {};
if(id == null){
return;
}
var mapOption = {
zoom: option.zoom || 16,
center:option.center || new google.maps.LatLng(35.68957386994604, 139.70044146139432),
@

====  ‚±‚ÌŠÔ¤à–¾‚ðÈ—ª¡  ====

@

< •â‘« >@@@@“KŽžŽQÆ‚ ‚êIB

@E@Wordpad@‚É‚æ‚éHTML¿°½iÀ¸Þj‚ðŒ©‚È‚ª‚ç‚Ì’¼Ú•ÒW•û–@B

ƒnƒ[i^. ^j