忍者ブログ
JavaScript , Java , DOS , HTML(CSS) , JSP , SQL , VB , VBScript , ・・・etc などの覚書
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

Google MAP API
(社内イントラサイトやユーザーIDなどが必要なホームページなどは、無償で使用できない)


参考
まーかーを複数設置: http://gmap3.blog52.fc2.com/blog-entry-17.html
住所から座標を取得: http://www.ajaxtower.jp/googlemaps/geocoding/index1.html

噴出し:http://www.nanchatte.com/map/showDifferentInfoWindowOnEachMarker.html

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body>


<input type='button' value='検索' onclick="aaa()">

<div id="map" style="width:100%; height:90%;"><br>
<script type='text/javascript'>

var realAdr = [
["仕入れ先1","東京都大田区"],
["仕入れ先2","横浜市青葉区"],
["仕入れ先3","大阪市平野区"]
];

var map = new google.maps.Map(document.getElementById("map"), {
zoom: 5,
center: new google.maps.LatLng(36,138),
mapTypeId: google.maps.MapTypeId.ROADMAP
});

 

function aaa(){

for (var i = 0; i < realAdr.length; i++) {

getLatLng(realAdr[i][1],realAdr[i][0]);
}
}

function getLatLng(place,placeName) {
var geocoder = new google.maps.Geocoder();

geocoder.geocode({
address: place,
region: 'jp'
},function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {

//var bounds = new google.maps.LatLngBounds();
for (var r in results) {
if (results[r].geometry) {

//座標取得
var latlng = results[r].geometry.location;

//bounds.extend(latlng);

var address = results[0].formatted_address.replace(/^日本, /, '');


//初期値は吹き出しなしの場合
var myMarker = new google.maps.Marker({
position: latlng,
map: map,
title: placeName
});

//クリックして吹き出し
attachMessage(myMarker, placeName);

/*
//吹き出しを付ける場合
new google.maps.InfoWindow({
content: placeName
}).open(map, new google.maps.Marker({
position: latlng,
map: map,
title: "aaa"
}));
*/

}
}
//map.fitBounds(bounds);
} else if (status == google.maps.GeocoderStatus.ERROR) {
alert("通信エラー");
} else if (status == google.maps.GeocoderStatus.INVALID_REQUEST) {
alert("リクエストエラー");
} else if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
alert("送信多数エラー");
} else if (status == google.maps.GeocoderStatus.REQUEST_DENIED) {
alert("ジオコーダの利用不可エラー");
} else if (status == google.maps.GeocoderStatus.UNKNOWN_ERROR) {
alert("サーバ側エラー");
} else if (status == google.maps.GeocoderStatus.ZERO_RESULTS) {
alert("見つかりません");
} else {
alert("エラー");
}
});
}


//クリックしたら吹き出し表示
function attachMessage(marker, msg) {
google.maps.event.addListener(marker, 'click', function(event) {
new google.maps.InfoWindow({
content: msg
}).open(marker.getMap(), marker);
});
}


</script>

</div>
</body>
</html>

PR
備忘録として

タスクの設定で、開始日を過去の日時にすると、明日から開始される。
現時刻より、1分でも遅く登録すれば、すぐ開始される。


なかなかお洒落なフォームを発見

http://www.emblematiq.com/lab/niceforms/


しかしCSSでなく、JavaScriptで表示後にデザインを変えている。
チェックボタンのチェックなどがJavascriptで出来なかったりする・・。


処理速度(1)に続く第2弾

1)new Array より [](Arrayリテラル)
for(var i=0;i<loop;i++)[]; // 約88ms
for(var i=0;i<loop;i++)new Array; // 約133ms
2)Math.absよりも三項演算子
絶対値を求める場合、Mathクラスのabsメソッドを呼ぶよりも三項演算子で解決したほうが高速です。1万回の試行で約18msの高速化!
function abs(){
   var a = 100;
   return a>0?a:-a;
}
for(var i=0;i<loop;i++)abs(); // 約50ms
function mathAbs(){
   var a = 100;
   return Math.abs(a);
}
for(var i=0;i<loop;i++)mathAbs(); // 約68ms
3)単純な数字文字列から数値の変換はプラス単項演算子で
数字文字列から数値を取得する方法はいくつかありますが、数字のみで構成される文字列であればプラス演算子で解決するのが高速です。parseInt呼び出しと比較した場合、1万回の試行で約80msの高速化!
for(var i=0;i<loop;i++)+"0"; // 約26ms
for(var i=0;i<loop;i++)parseInt("0"); // 約106ms
4)小数点切捨てにparseIntを利用しない
素直にMath.floorを利用したほうが高速です。1万回の試行で約50msの差が出ます。

for(var i=0;i<loop;i++)Math.floor(i); // 約74ms
for(var i=0;i<loop;i++)parseInt(i,10); // 約125ms

5)documentのアクセスはローカル変数に
for(var i=0;i<loop;i++)document; // 約11ms
var doc = document;
for(var i=0;i<loop;i++)doc; // 約4ms

6)domオブジェクトのプロパティアクセスに注意しろ!
for(var i=0;i<loop;i++)div.offsetWidth; // 約127ms
var ow = div.offsetWidth;
for(var i=0;i<loop;i++)ow; // 約5ms

7)try~catch~句は遅い
ry~catch~句が現れると、スクリプト実行に若干のオーバーヘッドが発生します。ループ内では注意が必要で、ループ全体をtry~catch~で囲んだほうがオーバーヘッドが少なくなるようです。

for(var i=0;i<loop;i++)i; // 約4.3ms
for(var i=0;i<loop;i++)try{i}catch(e){}; // 約5.8ms
try{for(var i=0;i<loop;i++)i;}catch(e){}; // 約4.9ms

8)真偽値評価はbooleanで
if文の評価にオブジェクトを書けば null or undefined でfalse扱いとなりますが、booleanで評価したほうが若干高速となるようです。
for(var i=0;i<loop;i++)if(true)i; // 約5.3ms
var o={};
for(var i=0;i<loop;i++)if(o)i; // 約7.5ms



 

HOMENext ≫
ブログ内検索
カレンダー
03 2025/04 05
S M T W T F S
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

Copyright © [ moriBlog-memo ] All rights reserved.
Special Template : 忍者ブログ de テンプレート Special Thanks : 忍者ブログCommercial message : [PR]