//--------------------------------------------------------------------------------------------------
// KsGMap - ポリライン・メーカー Ver1.01
// http://www.ksgmap.jp/
// Copyright(c) 2005 Ksc
// （！）このプラグインは KsGMap Ver 1.01 以降で動作します。
//--------------------------------------------------------------------------------------------------
//プラグインを登録（プラグイン名 , バージョン , 本体動作バージョン）
KsGMapEX.addPlugIn( "PolylineMaker" , 1.01 , 1.01 );
//グローバル関数定義
var ksgmapplugin_PolylineMaker_polyline = new Array();
var ksgmapplugin_PolylineMaker_currentPolyline , ksgmapplugin_PolylineMaker_currentMarker;
//ポリライン・メーカーを定義
var KsGMapPlugIn_PolylineMaker = new function(){
this.init = KsGMapPlugIn_PolylineMaker_init;
this.eventKeydown = KsGMapPlugIn_PolylineMaker_eventKeydown;
this.selectChange = KsGMapPlugIn_PolylineMaker_selectChange;
this.addPoint = KsGMapPlugIn_PolylineMaker_addPoint;
this.getPoint = KsGMapPlugIn_PolylineMaker_getPoint;
this.removePoint = KsGMapPlugIn_PolylineMaker_removePoint;
this.drawPolyline = KsGMapPlugIn_PolylineMaker_drawPolyline;
this.drawCurrent = KsGMapPlugIn_PolylineMaker_drawCurrent;
this.outportPoints = KsGMapPlugIn_PolylineMaker_outportPoints;
this.importPoints = KsGMapPlugIn_PolylineMaker_importPoints;
this.reversePoints = KsGMapPlugIn_PolylineMaker_reversePoints;
this.clearPoints = KsGMapPlugIn_PolylineMaker_clearPoints;
this.colorList = "#ff0000,赤 #ffff00,黄 #00ff00,黄緑 #00ffff,水色 #0000ff,青 #ff00ff,紫 #ffffff,白 #000000,黒"; //赤と青は削除しないで下さい
}
//コールバックを追加
KsGMapEX.addCallback( KsGMapInit , KsGMapPlugIn_PolylineMaker.init ); //KsGMap初期化
KsGMapEX.addCallback( KsGMapMap.event.moveEnd , KsGMapPlugIn_PolylineMaker.drawCurrent ); //マップ - イベント - 移動終了
KsGMapEX.addCallback( KsGMapMap.event.keyDown , KsGMapPlugIn_PolylineMaker.eventKeydown ); //マップ - イベント - キー操作
//□ポリライン・メーカー - 初期化
function KsGMapPlugIn_PolylineMaker_init(){
//ナビゲーション内のHTML生成
var option_color_polyline = ""; var option_color_currentPolyline = "";
var temp1 = KsGMapPlugIn_PolylineMaker.colorList.split( " " );
for( var i = 0 ; i < temp1.length ; i++ ){
var temp2 = temp1[ i ].split( "," );
option_color_polyline += "";
option_color_currentPolyline += "";
}
var insertHtml = "" +
"" +
"" +
"
" +
"" +
"" +
"" +
"" +
"" +
"
" +
"" +
"
" +
"" +
"
" +
"" +
"
ポリライン：" +
"
" +
"" +
"| カラー | |
" +
"| 太さ | |
" +
"| 透明度 | |
" +
"
" +
"
カレントポリライン：" +
"
" +
"" +
"| カラー | |
" +
"
" +
"
その他：" +
"
" +
"" +
"| 精度 | |
" +
"
" +
"
" +
"" +
"
";
document.getElementById( "polylineNavi" ).innerHTML = insertHtml;
//ポリラインXML入出力エリア内のHTML生成
var insertHtml = "" +
"ID： " +
"" +
"
" +
"" +
"" +
"";
document.getElementById( "polylineXML" ).innerHTML = insertHtml;
//カレントマーカー用のマーカーを生成
KsGMapDataMarker( "_plugin_PolylineMaker" , "http://labs.google.com/ridefinder/images/mm_20_red.png" , "http://labs.google.com/ridefinder/images/mm_20_shadow.png" , "" , 12 , 20 , 22 , 20 , 6 , 20 , 5 , 1 );
}
//□ポリライン・メーカー - キー操作
function KsGMapPlugIn_PolylineMaker_eventKeydown( event , keyCode ){
if( keyCode == 32 ){ KsGMapPlugIn_PolylineMaker_addPoint(); } //スペースキーでポイントの追加
}
//□ポリライン・メーカー - セレクトボックス変更
function KsGMapPlugIn_PolylineMaker_selectChange( event ){
if( event.shiftKey ){ //Shiftキー押しながら選択で、その位置にセンタリング
KsGMapMap.gmap.recenterOrPanToLatLng( KsGMapPlugIn_PolylineMaker.getPoint( document.getElementById( "ksgmapplugin--PolylineMaker-select" ).selectedIndex ) );
}
KsGMapPlugIn_PolylineMaker.drawPolyline();
KsGMapPlugIn_PolylineMaker.drawCurrent();
}
//□ポリライン・メーカー - ポイントの追加
function KsGMapPlugIn_PolylineMaker_addPoint(){
var accuracy = document.getElementById( "ksgmapplugin--PolylineMaker-accuracy" ).value;
var center = KsGMapMap.gmap.getCenterLatLng();
if( ( String( center.x ) + "00000" ).match( "^([0-9-]+)\.([0-9]+)" ) ){ var lng = RegExp.$1 + "." + RegExp.$2.substring( 0 , accuracy ); }
if( ( String( center.y ) + "00000" ).match( "^([0-9-]+)\.([0-9]+)" ) ){ var lat = RegExp.$1 + "." + RegExp.$2.substring( 0 , accuracy ); }
//一覧に追加
var option = document.createElement( "option" );
option.value = lat + " , " + lng;
option.appendChild( document.createTextNode( lat + " , " + lng ) );
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
var pos = ( obj.selectedIndex > 0 ? obj.selectedIndex : 0 );
obj.insertBefore( option , obj.options[ pos ] );
obj.selectedIndex = pos;
KsGMapPlugIn_PolylineMaker_drawCurrent( null , null , "markerOnly" ); //カレントマーカーのみ移動
KsGMapPlugIn_PolylineMaker.drawPolyline();
}
//□ポリライン・メーカー - ポイントの取得
function KsGMapPlugIn_PolylineMaker_getPoint( n ){
return ( document.getElementById( "ksgmapplugin--PolylineMaker-select" ).options[ n ].value.match( /([0-9\.-]+)\s,\s([0-9\.-]+)/ ) ? new GPoint( parseFloat( RegExp.$2 ) , parseFloat( RegExp.$1 ) ) : null );
}
//□ポリライン・メーカー - ポイントの削除
function KsGMapPlugIn_PolylineMaker_removePoint(){
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
if( obj.selectedIndex == - 1 ){ return ; }
var pos = obj.selectedIndex;
obj.options.remove( pos );
obj.selectedIndex = ( pos ? pos - 1 : 0 );
KsGMapPlugIn_PolylineMaker.drawPolyline();
KsGMapPlugIn_PolylineMaker.drawCurrent();
}
//□ポリライン・メーカー - ポリラインを描く
function KsGMapPlugIn_PolylineMaker_drawPolyline(){
var polyline_color = document.getElementById( "ksgmapplugin--PolylineMaker-polylineColor" ).value;
var polyline_weight = parseFloat( document.getElementById( "ksgmapplugin--PolylineMaker-polylineWeight" ).value );
var polyline_opacity = parseFloat( document.getElementById( "ksgmapplugin--PolylineMaker-polylineOpacity" ).value );
//一度すべて消す
for( var j = 0 ; j <= 2 ; j++ ){
if( ksgmapplugin_PolylineMaker_polyline[ j ] ){ KsGMapMap.gmap.removeOverlay( ksgmapplugin_PolylineMaker_polyline[ j ] ); }
}
//ポイント一覧の作成
var points = new Array();
points[ 0 ] = new Array(); points[ 1 ] = new Array();// points[ 2 ] = new Array();
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
var j = 0;
for( var i = 0 ; i < obj.options.length ; i++ ){
if( i >= obj.selectedIndex ){ j = 1; }
points[ j ][ points[ j ].length ] = KsGMapPlugIn_PolylineMaker_getPoint( i );
}
//描写処理
for( var j = 0 ; j <= 1 ; j++ ){
if( points[ j ].length >= 2 ){
ksgmapplugin_PolylineMaker_polyline[ j ] = new GPolyline( points[ j ] , polyline_color , polyline_weight , polyline_opacity );
KsGMapMap.gmap.addOverlay( ksgmapplugin_PolylineMaker_polyline[ j ] );
}
}
if( points[ 0 ].length >= 1 && points[ 1 ].length >= 1 ){
points[ 2 ] = new Array( points[ 0 ][ ( points[ 0 ].length - 1 ) ] , points[ 1 ][ 0 ] );
ksgmapplugin_PolylineMaker_polyline[ 2 ] = new GPolyline( points[ 2 ] , polyline_color , polyline_weight , ( polyline_opacity / 2 ) );
KsGMapMap.gmap.addOverlay( ksgmapplugin_PolylineMaker_polyline[ 2 ] );
}
}
//□ポリライン・メーカー - カレントポリライン／マーカーを描く
function KsGMapPlugIn_PolylineMaker_drawCurrent( lng , lat , type ){
var accuracy = document.getElementById( "ksgmapplugin--PolylineMaker-accuracy" ).value;
var polyline_color = document.getElementById( "ksgmapplugin--PolylineMaker-currentPolylineColor" ).value;
var polyline_weight = parseFloat( document.getElementById( "ksgmapplugin--PolylineMaker-polylineWeight" ).value );
var polyline_opacity = parseFloat( document.getElementById( "ksgmapplugin--PolylineMaker-polylineOpacity" ).value );
if( ksgmapplugin_PolylineMaker_currentPolyline ){ KsGMapMap.gmap.removeOverlay( ksgmapplugin_PolylineMaker_currentPolyline ); }
if( ksgmapplugin_PolylineMaker_currentMarker ){ KsGMapMap.gmap.removeOverlay( ksgmapplugin_PolylineMaker_currentMarker ); }
if( !lng || !lat ){ var center = KsGMapMap.gmap.getCenterLatLng(); var lng = center.x; var lat = center.y; }
if( ( String( lng ) + "00000" ).match( "^([0-9-]+)\.([0-9]+)" ) ){ var lng = RegExp.$1 + "." + RegExp.$2.substring( 0 , accuracy ); }
if( ( String( lat ) + "00000" ).match( "^([0-9-]+)\.([0-9]+)" ) ){ var lat = RegExp.$1 + "." + RegExp.$2.substring( 0 , accuracy ); }
//一番新しい座標を取得
var points = new Array();
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
if( obj.selectedIndex == -1 ){ return ; }
points[ 0 ] = KsGMapPlugIn_PolylineMaker_getPoint( obj.selectedIndex );
if( obj.selectedIndex != 0 ){ points[ 2 ] = KsGMapPlugIn_PolylineMaker_getPoint( obj.selectedIndex - 1 ); }
//ポリライン描写処理
if( document.getElementById( "ksgmapplugin--PolylineMaker-flagCurrentPolyline" ).checked && points && type != "markerOnly" ){
points[ 1 ] = new GPoint( lng, lat );
ksgmapplugin_PolylineMaker_currentPolyline = new GPolyline( points , polyline_color , polyline_weight , polyline_opacity );
KsGMapMap.gmap.addOverlay( ksgmapplugin_PolylineMaker_currentPolyline );
}
//マーカー描写処理
if( document.getElementById( "ksgmapplugin--PolylineMaker-flagCurrentMarker" ).checked ){
ksgmapplugin_PolylineMaker_currentMarker = new GMarker( points[ 0 ] , ksgmap_marker[ "_plugin_PolylineMaker" ].gicon );
KsGMapMap.gmap.addOverlay( ksgmapplugin_PolylineMaker_currentMarker );
}
}
//□ポリライン・メーカー - 一覧のアウトポート
function KsGMapPlugIn_PolylineMaker_outportPoints(){
var polyline_color = document.getElementById( "ksgmapplugin--PolylineMaker-polylineColor" ).value;
var polyline_weight = document.getElementById( "ksgmapplugin--PolylineMaker-polylineWeight" ).value;
var polyline_opacity = document.getElementById( "ksgmapplugin--PolylineMaker-polylineOpacity" ).value;
var polyline_id = document.getElementById( "ksgmapplugin--PolylineMaker-polylineID" ).value;
//ポイント一覧の作成
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
if( obj.options.length == 0 ){ alert( "ポイントが一つもありません。" ); return; }
var prefix = KsGMapPlugIn_PolylineMaker_outportPoints_getPrefix(); //プレフィックスの取得
//ポイント一覧の作成
var points = new Array();
var distance = 0;
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
for( var i = ( obj.options.length - 1 ) ; i >= 0 ; i-- ){
if( obj.options[ i ].value.match( /([0-9\.-]+)\s,\s([0-9\.-]+)/ ) ){ var lng = RegExp.$2; var lat = RegExp.$1; }
points[ points.length ] = lat.substring( prefix.lat ) + "," + lng.substring( prefix.lng ); //プレフィックスを除いたものを記録
if( i == 0 ){ //プレフィックスを記録しておく
var prefix_lng = lng.substring( 0 , prefix.lng );
var prefix_lat = lat.substring( 0 , prefix.lat );
}
//距離の算出（おまけ機能）
if( prev_lng ){ distance += KsGMapCommon.Map.convPointsToDistance( lng , lat , prev_lng , prev_lat ); }
var prev_lng = lng; var prev_lat = lat;
}
//ポリラインデータの書き出し
var result = "";
result += points.join( " " );
result += "\n";
document.getElementById( "ksgmapplugin--PolylineMaker-xml" ).value = result;
document.getElementById( "ksgmapplugin--PolylineMaker-distance" ).innerHTML = KsGMapCommon.String.sprintf( "総距離： %.2f Km" , distance );
}
//□ポリライン・メーカー - 一覧のアウトポート - プレフィックスの取得
function KsGMapPlugIn_PolylineMaker_outportPoints_getPrefix(){
//ポイント一覧の作成
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
for( var i = 0 ; i < obj.options.length ; i++ ){
if( obj.options[ i ].value.match( /([0-9\.-]+)\s,\s([0-9\.-]+)/ ) ){ var lng = RegExp.$2; var lat = RegExp.$1; }
if( i == 0 ){ //ベースとなる文字数をセット
var lng_length = lng.length; lat_length = lat.length;
} else { //一つ前と比較して、一致しない場合はベース文字数を減らす
for( var j = 0; j < lng_length ; j++ ){ if( lng.charAt( j ) != prev_lng.charAt( j ) ){ lng_length = j; break; } }
for( var j = 0; j < lat_length ; j++ ){ if( lat.charAt( j ) != prev_lat.charAt( j ) ){ lat_length = j; break; } }
}
var prev_lng = lng; var prev_lat = lat;
}
var result = { lng : lng_length , lat : lat_length }
return result;
}
//□ポリライン・メーカー - 一覧のインポート
function KsGMapPlugIn_PolylineMaker_importPoints(){
var xmlText = document.getElementById( "ksgmapplugin--PolylineMaker-xml" ).value;
if( !xmlText ){ alert( "インポートするデータがありません。" ); return; }
//ポイント一覧の作成
var obj = document.getElementById( "ksgmapplugin--PolylineMaker-select" );
//既にデータがある場合
if( obj.options.length ){
if( !confirm( "既にデータがありますが、上書きしてよろしいですか？" ) ){ return; }
KsGMapPlugIn_PolylineMaker.clearPoints( "noForm" );
}
//データ抽出
if( xmlText.match( /id=[\'\"]([^\'\"]+)[\'\"]/i ) ){ document.getElementById( "ksgmapplugin--PolylineMaker-polylineID" ).value = RegExp.$1; }
if( xmlText.match( /color=[\'\"](#[0-9a-z]{6})[\'\"]/i ) ){ KsGMapPlugIn_PolylineMaker_importPoints_setPulldown( "ksgmapplugin--PolylineMaker-polylineColor" , RegExp.$1 , RegExp.$1 ); }
if( xmlText.match( /weight=[\'\"]([0-9]+)[\'\"]/i ) ){ KsGMapPlugIn_PolylineMaker_importPoints_setPulldown( "ksgmapplugin--PolylineMaker-polylineWeight" , RegExp.$1 , RegExp.$1 ); }
if( xmlText.match( /opacity=[\'\"]([0-9\.]+)[\'\"]/i ) ){ KsGMapPlugIn_PolylineMaker_importPoints_setPulldown( "ksgmapplugin--PolylineMaker-polylineOpacity" , RegExp.$1 , String( Math.floor( RegExp.$1 * 100 ) ) + "%" ); }
if( xmlText.match( /prefix_lng=[\'\"]([0-9\.-]+)[\'\"]/i ) ){ var prefix_lng = RegExp.$1; } else { var prefix_lng = ""; }
if( xmlText.match( /prefix_lat=[\'\"]([0-9\.-]+)[\'\"]/i ) ){ var prefix_lat = RegExp.$1; } else { var prefix_lat = ""; }
if( xmlText.match( />(.+)= 0 ; i-- ){
obj.options[ i ] = null;
}
if( mode != "noForm" ){
KsGMapPlugIn_PolylineMaker.drawPolyline();
KsGMapPlugIn_PolylineMaker.drawCurrent();
}
}
//--------------------------------------------------------------------------------------------------