ログインしてさらにmixiを楽しもう

コメントを投稿して情報交換!
更新通知を受け取って、最新情報をゲット!

Visual Studioコミュの地図を基に建物の所在の表示とアクセス

  • mixiチェック
  • このエントリーをはてなブックマークに追加
初めましてSayです。どうぞよろしくお願いします。

ソフトの初心者です。現在、地図を基に建物の
位置所在を表示したり、アクセスしたりしたい
ですが、なかなかやりかたがわからなくて
困っています。

どなたか、そのやりかたをご存知の方いらっしゃいましたら
アドバイスいただけませんでしょうか?

【用件】
・ある地域の地図をGoogleMapsでフォーム
 またはPictureBoxに表示し、地図にある数箇所
 (緯度・経度既知)にマーカーを付けてその名称を
 (日本語)地図に表示する。あるマーカーを
 クリックすると、その位置に関する詳細説明を別
 フォームより表示する。
 
 Static Maps API を使ってみたですが、マーカーの
 ラベル表示が英文の1文字しか使えません。また、
 ズームイン/ズームアウトやマーカーをクリック
 する際の作業などはできないようです。
 https://developers.google.com/maps/documentation/staticmaps/?hl=ja#StyledMaps

・言語:VS2005 VB(必要であれば、VS2010のExpressへ)
・Windows ソフト

よろしくお願いします。

コメント(8)

あまりVBは詳しくないのですが・・・
僕の環境は VS2010 Pro ですので、違う部分もあるかもしれません。

まずドキュメントには「静的マップを表示できるのはブラウザのコンテンツ内だけ」とあります。
https://developers.google.com/maps/documentation/staticmaps/?hl=ja#Overview
よって、GoogleMapsの画像をPictureBoxで表示するのは避けたほうがいいと思います。

自分でも少しやってみたのですが、WebBrowser コントロールを使うのはどうでしょうか?
ツールボックスになければ、メニューから[ツール]>[ツールボックス アイテムの選択]>[.NET Framework コンポーネント]タブ>[WebBrowser]にチェックすれば出てくると思います。

フォームにWebBrowser コントロールを貼りつけて、プロパティでURLを指定します。

マーカーをクリックした際の詳細情報は WebBrowser コントロールの PreviewKeyDown イベントで何とかなりそうです。クリック位置とマークとの座標判定が必要です。

マーカーに名称を付けるのは軽くドキュメントを読んだ限り無理だと思います。
地図の前後に「Aは◯◯会社です」と書くしかないかもしれません。
マーカーのクリックですが、PreviewKeyDown の場合キーを押さなければならないのでダメのようです。
すみません。

ちょっとひねって、タイマーコントロールで擬似的にクリックを検出する方法がありそうです。
タイマーのイベントコードはこんな感じです。

Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
 If Control.MouseButtons = MouseButtons.Left Then
  Me.Label1.Text = String.Format("({0}, {1})", Control.MousePosition.X, Control.MousePosition.Y)
  'MsgBox("クリックしたね")
 End If
End Sub

これでいろいろ工夫すれば何とかなるのではないでしょうか。
できないことが漠然としていて、もうちょっと詳しく書かないと分かりませんよ。
cpageさんへ

 ご教授どうもありがとうございます。大変助かりました。少し勉強して内容を理解してからまた教えて頂きたいと思いますが、どうぞ宜しくお願いいたします。
cpageさんへ

早速、教えて頂いた方法で、(下記の構文で)やってみました。
着目する位置をクリックする度に、その位置のクライアント座標
が表示され、アクセスがうまくできました。どうもありがとう
ございました。

そこで、もう一つを教えていただければと思いますが。クリックした
建物の詳細情報を表示するために、得たマウスの位置情報を緯度経度
への変換が必要です。zoomとsizeから地図の縮尺を推定することが
できますか(例えばzoom=14,size=640X640の場合、WebBrowser1の
1ピクセル=XX経度ような精度の高くないものでもいいです。
他の建物の位置と区別(特定)できればよいです)?
あるいは、WebBrowser1に表示した地図の対角隅の緯度経度
を取得することができますか?

どうぞ宜しくお願いします。
--------------------------------------------------------------------

Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick

If Control.MouseButtons = MouseButtons.Left Then
Dim btnClientCurPos As Point = _
WebBrowser1.PointToClient(Cursor.Position)
Me.Label2.Text = String.Format("({0}, {1})", _
btnClientCurPos.X, btnClientCurPos.Y)
Label2.Location = New System.Drawing.Point _
(btnClientCurPos.X, btnClientCurPos.Y)
'MsgBox("クリックしたね")
End If
End Sub

Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click

Dim Url As String = "http://maps.google.com/maps/api/staticmap?" _
& "center=Brooklyn+Bridge,New+York,NY&zoom=14&size=640x640&" _
& "maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&" _
& "markers=color:green%7Clabel:G%7C40.711614,-74.012318&" _
  & "markers=color:red%7Ccolor:red%7Clabel:C%7C40.718217,-73.998284&" _
& "sensor=false"

WebBrowser1.Navigate(New Uri(Url))

Timer1.Interval = 1
Timer1.Start()

End Sub
おはようございます。

ネットでマウスクリックした位置の緯度/経度の数値を取得するサンプルをみつけました(http://www.geekpage.jp/web/google-maps-api/v3/get-xy.php)が、JavaScriptで書かれたものです。

そこで、自分の作ったVS2005のVBソフトにJavaScriptを埋め込むテストとして、簡単な例(http://www.geekpage.jp/web/google-maps-api/v3/helloworld.php)を使って下記のようにやってみましたが、エラー「'無効な URI: URI スキームが有効ではありません。」が出ました。

WebBrowserで送られるのは、"http://...”のものしかできないようです。VC#の場合には、「Form.Response.Write(Script);」を使ってサーバーに送ってよいですが、VBの場合には何を使ったらいいですか?

また、プロジェクト_Windowsフォームの追加にはHTMLページがありました。それを使ってJavaScriptで書かれたGoogle MAPS JavaScript APIのサンプルを使用することができますか?

どなたが、VS2005のVBでGoogle MAPS JavaScript APIのサンプルの活用方法をご存知の方いらっしゃいましたらアドバイスをいただけませんでしょうか?

どうぞ宜しくお願いします。
-------------------------------------------------------------------
Dim Script As String = "" 'スクリプト文
Script += "<!DOCTYPE html> \r"
Script += "<html> \r"
Script += "<head> \r"
Script += "<style type='text/css'> \r"
Script += "html { height: 100% } \r"
Script += "body { height: 100%; margin: 0px; padding: 0px }\r"
Script += "#map { height: 100% } \r"
Script += "</style> \r"
Script += "<script src='http://maps.google.com/maps/api/js?v=3&sensor=false' \r"
Script += "type='text/javascript' charset='UTF-8'></script> \r"
Script += "<script type='text/javascript'> \r"
'<![CDATA[
Script += "var map; \r"
' 初期化。bodyのonloadでinit()を指定することで呼び出してます
Script += "function init() { \r"
' (1) Google Mapで利用する初期設定用の変数
Script += "var latlng = new google.maps.LatLng(39, 138); \r"
Script += "var opts = { \r"
Script += "zoom: 6, \r"
Script += "mapTypeId: google.maps.MapTypeId.ROADMAP, \r"
Script += "center: latlng() \r"
Script += "}; \r"
' (2) Mapオブジェクトの生成
' getElementById("map")の"map"は、body内の<div id="map">より
Script += "map = new google.maps.Map(document.getElementById('map'), opts); \r"
Script += "} \r"
']]>
Script += "</script> \r"
Script += "</head> \r"

Script += "<body onload='init()'> \r"
Script += "<div id='map'></div> \r"
Script += "</body> \r"

Script += "</html> \r"
WebBrowser1.Navigate(New Uri(Script))
>6

コードについて

WebBrowser1.Navigate(New Uri(Script)) の部分はURLを指定します。
このコードでは HTML の内容そのものを渡していることになります。

HTMLファイルをローカル等に保存し、そのアドレスを指定するようにすれば良いです。

例えば a.html というHTMLファイル名でデスクトップに保存し、
WebBrowser1.Navigate(New Uri("file:///C:/Users/cpage/Desktop/a.html"))
とします。

また、VB では改行は vbCrLf を使います。
http://dobon.net/vb/dotnet/string/newline.html

引用符文字は "" とします。
http://msdn.microsoft.com/ja-jp/library/267k4fw5.aspx
cpageさんへ

早速、HTMLファイルを保存してWebBrowser1.Navigateに保存先を指定してテストしてみましたが、うまくできました。どうもありがとうございました。大変助かりました。

VBにJavaScriptの埋め込む方法も見直していただきまして、大変勉強になりました。

今後もどうぞ宜しくお願いします。

ログインすると、みんなのコメントがもっと見れるよ

mixiユーザー
ログインしてコメントしよう!

Visual Studio 更新情報

Visual Studioのメンバーはこんなコミュニティにも参加しています

星印の数は、共通して参加しているメンバーが多いほど増えます。