ホームページ上のフレームに、Google マップのある地点を中心に、1km/3km/5km/10kmなどの同心円(半透明で外側ライン)とその距離の表示をしようとしています。
クリックで動かさず、同心円と表示は固定です。
お店からの距離になります。

同心円は、以下のページを見て書き込めました。
http://www.nanchatte.com/map/circle-v3.html

しかし、1kmならばその円の近くに「1km」と表示する方法がわかりません。
どなたか、教えてください。

Googleマップの「立て札」の入れ方は情報が得られますが、
それではなく単に「1km」などの文字を入れたいだけです。
Googleマップの縮尺を変えても文字は読めることが、前提となります。

簡単なことで、聞いているとしたら申し訳ありません。
Java系は初心者です。

このQ&Aに関連する最新のQ&A

A 回答 (1件)

よく知りませんので、他にも方法があると思いますが、とりあえずそれっぽいものを。




1)普通に文字を入れるのなら、infoWindowが用意されています。
http://code.google.com/intl/ja/apis/maps/documen …
これだとユーザがクローズできたりするので…

2)makerを利用して、文字(=画像)を入れている例
http://www.tizdes.net/test_tile02.php?v=0.1

3)カスタムOverlayViewを利用して、文字を入れている例
http://www.mwsoft.jp/programming/googlemap/googl …

この回答への補足

いただいた情報で、いろいろやってみましたが、知識不足でうまく行きません。

1.同心円を描くプログラム
http://www.nanchatte.com/map/circle-v3.html

2.マーカーを立てるプログラム
http://googlemaps.googlermania.com/google_maps_a …

3.画像を表示をするプログラム
http://www.tizdes.net/test_tile02.php?v=0.1

の3ヶをエラーなく動かしたいのですがよく判りません。
さらなる知識お願いします。

1.同心円を描くプログラム:
<script type="text/javascript">
var myLatLng = new google.maps.LatLng(35.458782,139.604167);
var myMap = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true,
scrollwheel: false
});
new google.maps.Circle({
center: myLatLng, // 中心点(google.maps.LatLng)
fillColor: '#ff0000', // 塗りつぶし色
fillOpacity: 0.5, // 塗りつぶし透過度(0: 透明 ⇔ 1:不透明)
map: myMap, // 表示させる地図(google.maps.Map)
radius: 5000, // 半径(m)
strokeColor: '#ff0000', // 外周色
strokeOpacity: 1, // 外周透過度(0: 透明 ⇔ 1:不透明)
strokeWeight: 1 // 外周太さ(ピクセル)
});
</script>

2.マーカーを立てるプログラム:
・APIキーは取得しました。
・経度/緯度は同じです。

<script src="http://maps.google.com/maps?file=api&v=2&key=[あなたのAPIキー]" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

function load() {
if (GBrowserIsCompatible()) {

//地図を作成
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(35.458782,139.604167), 16);

//マーカーを追加
var marker = new GMarker(new GLatLng(35.458782,139.604167));
map.addOverlay(marker);

3.画像を表示をするプログラム:
・同心円の円弧のあたりに、xkmと画像で入れたいので、
中心座標は変えます。
・以下のscriptは、半透明のタイルを敷く部分も入ってますが、
 それは削除したいのですが、残す部分が不明です。

<script type="text/javascript">
//<![CDATA[
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.setCenter(new GLatLng(35.68184060244453, 139.74334716796875), 14);

var tilelayer = new GTileLayer(new GCopyrightCollection(), 0, 17);
tilelayer.getTileUrl = function() {return "./png/white.png";};
tilelayer.getOpacity = function() {return 0.3};
map.addOverlay(new GTileLayerOverlay(tilelayer));

point = new GLatLng(35.67082446779076, 139.73012924194336);
map.addOverlay(createMarker(point));

function createMarker(point) {
var icon_c = new GIcon();
icon_c.image = "./png/test_tile02.png";
icon_c.iconSize = new GSize(200, 20);
icon_c.iconAnchor = new GPoint(0,20);

var marker = new GMarker(point,icon_c);
return marker;
}

var request = GXmlHttp.create();
//]]>
</script>

超初心者的で申し訳ありませんが、助けてください。

補足日時:2011/04/29 08:20
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Q「仲良しであること」を表す漢字1文字

タイトル通り、「仲良しであること」を1文字で表せる漢字を探しています。この場合の「仲良し」は男女間なのですが、「恋人同士として仲良し」なのではなく「友達として、チームとして仲良し」を意味します。ちなみにこの漢字1文字は、オリジナルTシャツのデザインにする予定です。

自分なりに考えてみると「和」くらいしか思いつかないのですが、それではありきたりなのでもう少しひねった漢字にしたいと思っています。他に「懇ろ」も思いつきましたが(「ろ」は入れません)、これだと「友達として仲良し」ではなくなってしまうなぁ、と思いました。

何かいい漢字がありましたら、あるいは意味から漢字を調べられるようなサイトがありましたら、ぜひ教えてください。よろしくお願いします。

Aベストアンサー

・藹(和気藹々)

・欒(団欒)

・間を○で囲って「仲間」をイメージ

・良を○で囲って「仲が良い」をイメージ

QGoogle マップにマーカーと同心円を入れたい

2回目の質問です。前回の掲載期間で、解決できなかったため。
超初心者的質問ですが、教えてください。

Google マップのある地点を中心に、
マーカーと1km/5km/10kmなどの同心円(半透明で外側ライン)の2種を表示をしようとしています。
おのおの単独で表示することは、例がありわかりましたが、
その2つを同時に表示するために、scriptを変更するのがわかりません。

1. マーカーを表示するscript

<script src="http://maps.google.com/maps?file=api&v=2&key=[あなたのAPIキー]" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

function load() {
if (GBrowserIsCompatible()) {

//地図を作成
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng( 緯度 , 経度 ), 地図サイズ );

//マーカーを追加(国会議事堂)
var marker = new GMarker(new GLatLng( 緯度 , 経度 ));
map.addOverlay(marker);

}
}

//]]>
</script>

2. 同心円を表示するscript

<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script>

<div id='map' style='width:700px; height:400px;'><br /></div>
<script type="text/javascript">
var myLatLng = new google.maps.LatLng( 緯度 , 経度 );
var myMap = new google.maps.Map(document.getElementById('map'), {
zoom: 地図サイズ,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true,
scrollwheel: false
});
new google.maps.Circle({
center: myLatLng, // 中心点(google.maps.LatLng)
fillColor: '#ff0000', // 塗りつぶし色
fillOpacity: 0.5, // 塗りつぶし透過度(0: 透明 ⇔ 1:不透明)
map: myMap, // 表示させる地図(google.maps.Map)
radius: 95330, // 半径(m)
strokeColor: '#ff0000', // 外周色
strokeOpacity: 1, // 外周透過度(0: 透明 ⇔ 1:不透明)
strokeWeight: 1 // 外周太さ(ピクセル)
});
</script>

この2ヶのscriptをどのようにつなげば、解決できるか教えてください。
JavaScriptの基本知識不足のため、書いていただければ助かります。

2回目の質問です。前回の掲載期間で、解決できなかったため。
超初心者的質問ですが、教えてください。

Google マップのある地点を中心に、
マーカーと1km/5km/10kmなどの同心円(半透明で外側ライン)の2種を表示をしようとしています。
おのおの単独で表示することは、例がありわかりましたが、
その2つを同時に表示するために、scriptを変更するのがわかりません。

1. マーカーを表示するscript

<script src="http://maps.google.com/maps?file=api&v=2&key=[あなたのAPIキー]" type="text/javascript"></s...続きを読む

Aベストアンサー

#1です。

>間に埋め込んだら、google.~が定義されていませんと出ます。
>最初の方に必要な記述があるのでしょうか?
goggle map の本体の読み込みは必須です。(goggle mapを利用するのですから)
参照されている例のどちらにもある(内容は少し違いますが)外部ファイルを読み込んでいる部分が必要です。

以下テストした全ソース。
* この回答欄ではhtt~が自動リンクになってしまうので、http→httpに
* 画像のアドレスは適当なものに変更してください
そのまま実行すれば、添付画像のような表示になるはず。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head><title>sample</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<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>
<div id='map' style='width:700px; height:400px;'></div>

<script type="text/javascript">
<!--
var myLatLng = new google.maps.LatLng(35.684594,139.75311);

//地図を表示
var myMap = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true,
scrollwheel: false
});

//円を3個表示
var i, data = [
[5000, 0.1],
[2500, 0],
[500, 0]
];
for(i=0; i<data.length; i++){
new google.maps.Circle({
center: myLatLng,
radius: data[i][0],
fillColor: '#ff0000',
fillOpacity: data[i][1],
map: myMap,
strokeColor: '#ff0000',
strokeOpacity: 1,
strokeWeight: 1
});
}

//マーカーを表示
var markerImage = 'icon1.gif';
var marker = new google.maps.Marker({
position: myLatLng,
map: myMap,
icon: markerImage
});

//-->
</script>
</body>
</html>

#1です。

>間に埋め込んだら、google.~が定義されていませんと出ます。
>最初の方に必要な記述があるのでしょうか?
goggle map の本体の読み込みは必須です。(goggle mapを利用するのですから)
参照されている例のどちらにもある(内容は少し違いますが)外部ファイルを読み込んでいる部分が必要です。

以下テストした全ソース。
* この回答欄ではhtt~が自動リンクになってしまうので、http→httpに
* 画像のアドレスは適当なものに変更してください
そのまま実行すれば、添付画像のような表示になるはず...続きを読む

Q漢字3文字の名前

もうすぐ女の子を出産予定です。
漢字3文字の名前を考え中ですが、3文字の名前って、書くときに長すぎたりバランスが取りにくかったりするものでしょうか。
ちなみに苗字は漢字2文字です。
私自身は漢字2文字の名前なので良くわからなくて・・・。
ご自身のお名前が漢字3文字の方、お子さんのお名前が漢字3文字の方、よければコメントをお願いします♪

Aベストアンサー

私自身が三文字です。

苗字や、三つの漢字の画数にもよりますが、
一般的に三文字の漢字で特に不都合を感じたことはありません。
バランスもとりにくいと思ったことはないです。

ただ子供の頃から、もし将来結婚して苗字が変わるなら、
読みが三文字で漢字も三文字(例えば佐々木さんとか)の人とは
結婚したくないな~と、思っていました。苗字も名前もすべて一文字
ずつ書くのは、何となくですが、当て字というか、
ヨロシクを夜露四苦と書くようなイメージがあって・・・
(完全に主観的な感想です^^;)

以外に便利だと思うのは、たくさんの名前の中から自分の
名前を探さなければならないような場面(学生時代等はよく
ありました。名簿とか。)で、三文字の名前って、
すごく探しやすくて良かったです(笑)。
二文字の子が多い中で、三文字が並ぶとぱっと目が行きますから。

QGOOGLEマップのマイマップでマーカーを大量に貼り付けているのですが

GOOGLEマップのマイマップでマーカーを大量に貼り付けているのですが、表示に時間がかかってしまいます。
現在の中心点からある一定距離のマーカーを一定数(50個など)のみ表示させるにはどのような技術を使えばよろしいのでしょうか。

ご存知の方いらっしゃいますか。よろしくお願いします。

Aベストアンサー

マイマップの機能にはありませんね。
制御したいなら、「Google Maps Api」というjavascriptの
プログラムをご自身で作成する必要があります。
「初歩的なjavascriptの知識が必須となります。」
公式ページ
http://code.google.com/intl/ja/apis/maps/
入門的なページ
http://googlemaps.googlermania.com/
GMarkerManagerというクラスを使うとお望みの事ができます。
http://googlemaps.googlermania.com/google_maps_api_v2/map_example_gmarkermanager_with_labeldmarker.html

Qこの文字(アート・デザイン)の名称を教えてください。

5年ほど前、軽井沢のプリンスショッピングプラザ(アウトレット)で学生風の方が露天商のような形で商売をしていました。商品は客の名前をデザインされたアートな文字で書いてくれるというものでした。情報が少なくて申し訳ないのですが、知っている方がおりましたら教えてください。
【その文字について】
・幅5cm程度のスポンジのようなものに原色系の顔料を染みこませて、虹のような色遣いで書く。
・基本的にはアルファベットであるが、漢字でも書いてくれるようだった。
・文字の一つ一つに植物や鳥が描かれている(熱帯系のデザインに見える)。
・1枚1000円ぐらいで書いてくれた。
・とてもおめでたい(幸運を呼ぶ)文字らしい。

参考になるサイト等ありましたらご紹介ください。よろしくお願いいたします。

Aベストアンサー

No.1の回答者です。

違かったですか…。他には知らないですね。すみません。

今回は、

>当時「花文字」以外の呼び名を聞いたような気がしているのですが・・・

の補足回答です。質問の回答ではないので、あしからず。

「花文字」という呼び名のほかには、
「花鳥文字」「吉祥花文字」「開運風水花文字」「花鳥書法」「虹書法」などあるようです。(種類が違うのかもしれませんが…)


そういえば、

>学生風の方が露天商のような形で商売をしていました

ということなのですが、
その学生風の人のオリジナルという可能性もあるのでは?とも思ったんですが。


最後に、ほかに「花文字」に関するサイトを見つけたので紹介しておきます。
もはや関係のないものなので、参考という程度に。

http://www.asia-jps.com/hana01.html

http://kotobukimiyuki.at.infoseek.co.jp/miyukiss/hanamoji.jpg

http://www.d-word.jp/pdt_related1/

http://www.giwado.com/order/kachomoji.html

No.1の回答者です。

違かったですか…。他には知らないですね。すみません。

今回は、

>当時「花文字」以外の呼び名を聞いたような気がしているのですが・・・

の補足回答です。質問の回答ではないので、あしからず。

「花文字」という呼び名のほかには、
「花鳥文字」「吉祥花文字」「開運風水花文字」「花鳥書法」「虹書法」などあるようです。(種類が違うのかもしれませんが…)


そういえば、

>学生風の方が露天商のような形で商売をしていました

ということなのですが、
その学...続きを読む

Qホームページ上にある表を更新

ホームページ上に、下の表のようなものがあったとします。

-----------------
|No| 番号 | 名前 |
-----------------
|01| 数字 | 文字 |
-----------------
|02| 数字 | 文字 |
-----------------
 ----
|送信|
 ----
01、02の”数字・文字”のところのセルには通常
何も無い空白の状態とします。
ここに任意の数字や文字をいれ
送信を押すと、掲示板のようにホームページ
に反映・更新できないものでしょうか。
教えていただきたいのですが・・・・

Aベストアンサー

利用・閲覧者限定であれば一時的なものであれば、可能でしょうが、
更新となるとファイルに書きこむ作業が必要になります。
JavaScriptにはそんな機能はありません。
CGI等を利用すれば可能です。

Q漢字の他に、漢字のように何万字もあるような複雑な文字ってあるんでしょう

漢字の他に、漢字のように何万字もあるような複雑な文字ってあるんでしょうか?

やっぱり、漢字が世界で最も文字数の多い文字なんでしょうか?

Aベストアンサー

 文字には大きく分けて二種類あります。音(意味がない)によるものと語によるものです。世界の文字を全部勉強した訳ではありませんが、文字組織からだいたいの見当はつきます。

(1)音をあらわすもの。
  音素文字、いわゆるアルファベットはその例。母音を表す文字と子音を表す文字で総数50以下。

  音節文字、日本語の仮名はその例。総数は多くても150以下

(2)語を表すもの。表語文字、漢字はその例。1994年の『中華字海』では、85,568字。日本の常用でも2,000字程度。

>>やっぱり、漢字が世界で最も文字数の多い文字なんでしょうか?

 多分そうだろうと思います。

http://ja.wikipedia.org/wiki/%E6%96%87%E5%AD%97

Qgoogle map apiを使って自宅周辺を100メートル単位の同心円を5個書きたい

google map apiとJavaScriptを使って自宅周辺を100メートル単位の同
心円を5個書きたい。

この方法をネットで探したが探せなかった。良いサイトがあれば教えて
ほしい。宜しく、お願いします。

Aベストアンサー

ANo2です。

>ピンを立てる場所と言うのは、決めています。
>座標は分かるのですが、ピンを立てる方法が分かりません。
表示するものがあらかじめ決まっているのであれば、比較的簡単ですね。

>対象となるピンのオブジェクトを指定する方法と、
>地図にそのオブジェクトを反映させる方法が分かりません。
ANo1であげたサンプルの、『//マーカーを表示』以降の6行ほどがマーカー作成・表示の処理になっています。
座標値(myLatLng,)やマーカの画像(markerImage:アイコンのURI)などを適宜変えて呼び出すようにすれば、表示されるはずです。
座標値や画像URIを引数にして関数化しておき、必要な回数だけ呼び出せばよろしいかと思います。

Qロゴや文字のデザイン。

漢字やひらがな、英語などデザイン風に少しデフォルメして書きたいのですがどのようにかけばかっこよく見えるでしょうか。
よく、路上の壁面に書いてあるような文字の書き方(特徴)などわかるかたおしえてください。
文字がなんて書いてあるかが少しわかんないくらいにしたいのですが。
ロゴのようなものでも良いです。
最近の10代20代くらいの人が好きそうな感じで…
よろしくおねがいします。

Aベストアンサー

グラフィティ(らくがきと言う意味で)と呼ばれる文字ですね。かっこ良く、なんて書いてあるかがわかんないくらいの文字が書けるように、みんなひたすら紙に書いて練習しているのだと思います。

当たり前ですが、シャッターやコンクリの塀、人の迷惑になる場所に書くのは犯罪ですので、そういった場所に書くのは絶対にやめましょう。

こんなところとかご参考に
http://www.11-d.nu/

以下のサイトからは、PLAY→好きな英字入力で作れます。

参考URL:http://www.mindgem.nu/graffiti.html

Qフレームではなくページの中央にフレーム?・・・

最先端のサイト(?)に行くと、フレームではなくて、ページの中央に別空間のようにページが表示されているものがあります。その「別空間」だけにスクロールバーもついています。
これってjavascriptで操作しているのですか?
これは、javascriptのいろいろなページでもサンプル見たことがないので質問させていただきます。

(例)
http://www.fujitv.co.jp/jp/warauinu/

Aベストアンサー

こんな感じでどうでしょうか?
個人的には多重フレームで表示が遅くなったり
ウィンドウが小さいと表示されなかったりするので大嫌いです。

<HTML>
<FRAMESET rows="10%,80%,10%" border=0 frameborder=0 framespacing=0>
<FRAME src="" scrolling="no" noresize>
<FRAMESET cols="10%,80%,10%" rows="*" border=0 frameborder=0 framespacing=0>
<FRAME src="" scrolling="no" noresize>
<FRAME src="main.html">
<FRAME src="" scrolling="no" noresize>
</frameset>
<FRAME src="" scrolling="no" noresize>
</frameset>
</HTML>


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング