道順・ﾙｰﾄの表示 　 出発 :

到着 :
　　走行ｼﾐｭﾚｰｼｮﾝ　　


速度 : 1x
発着候補 :

熊本　　阿蘇山
調布飛行場　　東京ﾃﾞｨｽﾞﾆｰﾗﾝﾄﾞ
ｶﾝｸﾝ,ﾒｷｼｺ　　ﾁｭﾄｩﾏﾙ
ﾘﾙ=ﾙｯｽ,ﾌﾗﾝｽ　　ｶﾙｼﾞｪｰｽﾞ
ﾃｨﾝｸﾞﾙ,ｱｲﾙﾗﾝﾄﾞ　　ﾊﾞﾘｰﾊﾞﾆｵﾝ
ﾋﾞｴﾇﾗ,ﾌﾗﾝｽ　　ﾊﾞﾙｶｯｼﾞｮ
ｾﾝﾄ･ﾍﾚﾝｽﾞ,ﾀｽﾏﾆｱ　　ｽﾀﾝﾘｰ
ｺｽﾀ･ﾊﾟﾗﾃﾞｨｰｿﾞ,ｲﾀﾘｱ　　ﾊﾞﾗｰｳ
ﾗｯｸ･ﾃﾞ･ｱｰｸｽﾞ,ｶﾅﾀﾞ　　 ｸﾞﾚｰｼｬｰ国立公園
ﾄﾞｰﾑｽ･ﾃﾞ･ﾏﾘｰｱ,ｲﾀﾘｱ　　ｶﾙﾎﾞﾆｱ
ﾎﾟｰﾄﾘｰ,UK　　ｱﾗﾌﾞｰﾙ
ﾏﾗｽﾙ,ｽﾍﾟｲﾝ　　ﾌﾟｴﾙﾄ･ﾃﾞ･ｻﾝﾃｨｱｺﾞ
ﾎﾞﾙﾄｽｸｰｿﾞ,ｲﾀﾘｱ　　ﾏﾙﾌｨﾀﾞﾉ
ｿﾙｿ.ｲﾀﾘｱ　　ｱﾘｴﾝﾄｩ
ｽｷﾊﾞﾘｰﾝ.ｱｲﾙﾗﾝﾄﾞ　　ｶｱｰｼﾋﾞｰﾝ
ｳﾞｨｯﾗｼﾐｰｳｽ.ｲﾀﾘｱ　　ｵﾛｾﾞｲ
ﾆﾅﾅ.ｱﾗｽｶ　　ﾌﾟﾚｻﾞﾝﾄ・ﾊﾞﾚｰ
ﾌﾞﾘﾝﾃﾞｨｼﾞ,ｲﾀﾘｱ　　ﾊﾞｰﾘ
ﾊﾅｳﾏ･ﾍﾞｲ,USA　　ｶｲﾙｱ
ﾃﾙﾓﾘ,ｲﾀﾘｱ　　ﾍﾟｽｶｰﾗ
ｸﾚｲﾝ･ﾓﾝﾄﾞ,南ｱﾌﾘｶ　　ｺﾞｰﾄﾞﾝｽﾞ･ﾍﾞｲ
ｼﾞｪｰﾗ,ｲﾀﾘｱ　　ｼｬｯｶ
ｵｰﾚｽﾝ,ﾉﾙｳｪｰ　　ﾓﾙﾃﾞ
ﾊｳｹﾞｽﾝ,ﾉﾙｳｪｰ　　ﾍﾞﾙｹﾞﾝ
ﾀｶﾃ,ﾒｷｼｺ　　ﾒﾋｶﾘ
ｲﾝﾊﾞｰｷﾞﾙ,ﾆｭｰｼﾞｰﾗﾝﾄﾞ　　ｸﾞﾚｲﾏｳｽ
ﾌｧｲﾝｶﾞﾚｲ,ﾆｭｰｼﾞｰﾗﾝﾄﾞ　　ﾌｧｶﾀﾆ
ﾊｳｪﾗ,ﾆｭｰｼﾞｰﾗﾝﾄﾞ　　ｳｪﾘﾝﾄﾝ
ｸﾗｲｽﾄﾁｬｰﾁ,ﾆｭｰｼﾞｰﾗﾝﾄﾞ　　ﾌﾞﾚﾅﾑ
ｵﾎﾟﾃｨｷ,ﾆｭｰｼﾞｰﾗﾝﾄﾞ　　ﾈｰﾋﾟｱ
ﾎﾞｰﾃﾞｰｶﾞ･ﾍﾞｲ,USA　　Sea Ranch,USA

ﾃﾞﾓは、〔開始〕と〔発進！〕を押し、〔＋〕（加速）・〔-〕（減速）で。　通過点のｸﾘｯｸで、Warp！。　
ﾙｰﾄ変更を、発着場所のﾀｲﾌﾟｲﾝで。

　

　

ﾎｰﾑ　へ　　　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　Google Earth6　　google_earth6.htm

ﾄﾞﾗｲﾌﾞｼﾐｭﾚｰﾀｰ（3Dﾛｹｰｼｮﾝ+地図）。　　　　　　Google Earth API、DHTML。　　　　　　表示ｻｲｽﾞなどのｶｽﾀﾏｲｽﾞはﾃｷｽﾄｴﾃﾞｨﾀｰなどで可。　　all 対応、≠IE（64bit）。　　　　　ｺﾋﾟｰ、編集し、簡単にWebで応用できまっ、(^ ^)。

ﾃﾞﾓは、〔開始〕と〔発進！〕を押し、〔＋〕（加速）・〔-〕（減速）で。　　ﾙｰﾄ変更を、発着場所のﾀｲﾌﾟｲﾝで。

　

< ご使用方法 >

　・　ﾛｰｶﾙ（=PC）への保存は、driving/をｸﾘｯｸ開いたﾎﾙﾀﾞｰで、google_earth6.htm、index.css、index.js、simulator.js を右ｸﾘｯｸ、[対象をﾌｧｲﾙに保存] - 【ﾌｧｲﾙのﾀﾞｳﾝﾛｰﾄﾞ】、【ﾌｧｲﾙ名を付けて保存】 - <保存する場所>： ……、などで。　　　　※:  変わってしまった、ﾌｧｲﾙ名や、*.html 中のﾊﾟｽは要修正。

　・　このDHTMLの実装方法は、google_earth6.htm をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、ﾎｰﾑﾍﾟｰｼﾞ作成ｿﾌﾄなどのHTML挿入/編集ﾒﾆｭｰなどを使って、新しいﾍﾟｰｼﾞ 1 や hogehoge.html（=任意の挿入先ﾌｧｲﾙ名） の、 <head>　〜　</head> の任意の行間に (*1)を、さらに <body>　〜　</body>の任意の行間に (*2) をﾍﾟｰｽﾄします。 　　　ﾍﾟｰｽﾄするｺｰﾄﾞとｷｰは、Google Earth API Examples > Driving Simulatorと、Google MAPS API に登録する で入手。

　･　編集方法は、hogehoge.html を WordPad や SmipleTextなどのﾃｷｽﾄｴﾃﾞｨﾀｰ、あるいは ”FrontPage Express” などのﾎｰﾑﾍﾟｰｼﾞ制作ｿﾌﾄのHTMLﾀｸﾞ挿入/編集ﾒﾆｭｰ で開き編集します。　　　　下記の（例） (*1) と、(*2) を参考に太字部分の編集を任意に行います。　　　※: ﾃｷｽﾄｴﾃﾞｨﾀｰによる編集は、HP制作ｿﾌﾄとの互換性の問題を生じません（HP制作ｿﾌﾄ間は少し生じる）。

　・　作動ﾃｽﾄは、ﾛｰｶﾙ（PC）に保存し、 Internet Explorer 8.x〜 などで開いて。　　　　更新の確認は [F5]ｷｰ を押し、ｻｰﾊﾞｰやﾌﾞﾗｳｻﾞｰのｷｬｯｼｭｸﾘｱｰ、最新ﾃﾞｰﾀ読み込み（≠再ｱｸｾｽ）で行います。

　･　ｱｯﾌﾟﾛｰﾄﾞや作動ﾃｽﾄは、hogehoge.html と同じ階層〔ﾎﾙﾀﾞｰ/ﾃﾞｨﾚｸﾄﾘｰ〕に、使用する画像なども転送/配置し実施。　　※：別ﾃﾞｨﾚｸﾄﾘｰに配置時は、*.html 中のﾊﾟｽは要修正。　　　FTPなどで変わっ てしまったﾌｧｲﾙ名は要修正。　　　　ｽｸﾘﾌﾟﾄ構文中への改行混入は非作動原因。

　･　関連情報 ：色記号5 、〃6、ｽﾀｲﾙｼｰﾄﾘﾌｧﾚﾝｽ、ﾎｰﾑﾍﾟｰｼﾞ開設入門が便利！。　　　Web Development、Web開発、MSDN IE8 HTMLとCSS、開発ﾂｰﾙでｻｲﾄを修正、ｽｸﾘﾌﾟﾄ ﾃﾞﾊﾞｯｸﾞの概要、HTMLとCSSのｻﾎﾟｰﾄ、CSSの改良点、IE7、IE6、XML、DHTML。

　

(*1) ：　google_earth6.htm （例）　　　　　　　　　挿入先の 　<head> 〜 </head>　の、〜 部分にﾍﾟｰｽﾄします。

　HTMLの編集方法　  (*1) をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
〔この列ﾍﾟｰｽﾄ不要〕  　

ｼﾌﾄJIS使用（削除不可）

ｉｅなどに表示するｱｲｺﾝﾌｧｲﾙ名（削除可）

<style type= 〜  </style>は（削除可）
(*1)〜(*3)表ﾀｲﾄﾙ背景

body 文字色　背景色　下線
ﾊｲﾊﾟｰﾘﾝｸ 〃
表示済みの〃
ﾏｳｽｵｰﾊﾞｰ時の〃
ｸﾘｯｸ中の〃
ﾌｫﾝﾄ

ﾘﾝｸを新しいWinで開くを標準（削除可）※：target=　いろいろ
同じﾌﾚｰﾑ=_self、ﾍﾟｰｼﾞ全体=_top、親ﾌﾚｰﾑ=_parent
お気に入り、ﾀｽｸﾊﾞｰに表示するﾍﾟｰｼﾞ名（≠ﾌｧｲﾙ名）

　

自分の“APIｷｰ”を取得、書き換える。

　

　

　

　

　

　

　

　

　

　

　

　

ﾃﾞﾌｫﾙﾄ座標　ｽﾞｰﾑ

　

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
　

<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>サンプルページ　　Google Earth6</title>

<!--　☆ -----------　↓ この間をコピー＆ペーストします。 ------------　-->

<!--　☆ -----------　↓ この間をコピー＆ペーストします。 ------------　-->
<script type="text/javascript" src="http://www.google.com/jsapi?hl=en&amp;key=ABQIAAAAuMdjTKAMJZ-　……　ywdygGusUG8MbQ"></script>
<style type="text/css">@import "index.css";</style>
<script type="text/javascript" src="http://earth-api-samples.googlecode.com/svn/trunk/lib/geplugin-helpers.js"></script>
<script type="text/javascript" src="http://earth-api-samples.googlecode.com/svn/trunk/lib/math3d.js"></script>
<script type="text/javascript" src="simulator.js"></script>
<script type="text/javascript" src="index.js"></script>
<script type="text/javascript">
// <![CDATA[

var DS_ge;
var DS_geHelpers;
var DS_map;

google.load("jquery", "1");
google.load("maps", "2.x");
google.load("earth", "1");

function DS_init() {
$('#directions-form input').attr('disabled', 'disabled');
$('#simulator-form input').attr('disabled', 'disabled');

google.earth.createInstance(
'earth',
function(ge) {
DS_ge = ge;
DS_ge.getWindow().setVisibility(true);
DS_ge.getLayerRoot().enableLayerById(DS_ge.LAYER_BUILDINGS, true);
DS_ge.getLayerRoot().enableLayerById(DS_ge.LAYER_BORDERS, true);
DS_geHelpers = new GEHelpers(DS_ge);

DS_ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);

DS_map = new GMap2($('#map').get(0));
DS_map.setCenter(new GLatLng(35.6934, 139.7498), 13);
DS_map.addControl(new GSmallMapControl());
DS_map.enableContinuousZoom();

$('#directions-form input').removeAttr('disabled');
},
function() {
});

function onresize() {
var clientHeight = document.documentElement.clientHeight;

$('#route-details, #earth, #map').each(function() {
$(this).css({
height: (clientHeight - $(this).position().top - 100).toString() + 'px' });
});
}

$(window).resize(onresize);
onresize();
}

google.setOnLoadCallback(DS_init);

// ]]>
</script>
<!--　☆ -----------　↑ この間をコピー＆ペーストします。 ------------　-->
　

　

(*2) ：　google_earth6.htm （例）　　　　　　　　挿入先の 　<body> 〜 </body>　の、〜 部分にﾍﾟｰｽﾄします。

　HTMLの編集方法　  (*2)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
〔この列ﾍﾟｰｽﾄ不要〕

※：<body>　部の編集　背景　ﾘﾝｸ　表示済みﾘﾝｸﾝｸ　ｱｸﾃｨﾌﾞﾘﾝｸの各色（任意値）

表示ｻｲｽﾞ
位置

　

<body onunload="GUnload();"  bgcolor="#F9F8F9" link="#54006C" vlink="#62000D" alink="#00FFFF">

<!--　★　-----------↑の onunload= ……　と、↓ この間をコピー＆ペーストします。 ------------　-->
<table style="width: 100%; height: 400px;">
<tr>
<td style="width: 300px" valign="top">
<table style="width: 300px">
<tr>
<td style="width: 50%" valign="top">
<form id="directions-form" onsubmit="return false;" action="get">
<fieldset>
<legend>Directions</legend>
発:<br/>
<input type="text" id="from" value="hino,tokyo"/><br/>
着:<br/>
<input type="text" id="to" value="kamogawa,chiba"/><br/>
<input type="submit" onclick="DS_goDirections();" id="go" value="発進！"/>
</fieldset>
</form>
</td>
<td style="width: 50%" valign="top">
<form id="simulator-form" onsubmit="return false;" action="get">
<fieldset>
<legend>Simulator</legend>
<input type="button" onclick="DS_controlSimulator('reset');" value="Reset"/><br/>
<input type="button" onclick="DS_controlSimulator('start');" value="Start"/><br/>
<input type="button" onclick="DS_controlSimulator('pause');" value="Pause"/><br/>
Speed: <strong><span id="speed-indicator">1x</span></strong><br/>
<input type="button" onclick="DS_controlSimulator('slower');" value="-"/>
<input type="button" onclick="DS_controlSimulator('faster');" value="+"/>
</fieldset>
</form>
</td>
</tr>
</table>
<div id="route-details"></div>
</td>
<td style="width: 67%" valign="top">
<div id="earth" style="border: 1px solid #000; height: 500px;">
<div id="status"></div>
</td>
<td style="width: 33%" valign="top">
<div id="map" style="border: 1px solid #000; height: 500px;"></div>
</td>
</tr>
</table>
<!--　★　-----------　↑ この間をコピー＆ペーストします。 ------------　-->

====  この間､説明を省略｡  　任意HTML、動作に無関係　====

　

< 補足 >　　　　適時参照あれ！。

　・　ﾒﾓ帳によるHTMLｿｰｽ（ﾀｸﾞ）を見ながらの直接編集方法。

ハロー（^. ^）