投稿者 らいよん  (社会人) 投稿日時 2019/5/16 10:00:38
vb.net(Visual Studio 2017)でwebBrowserにopenLayer(v5.3.0)を使用して国土地理院地図を表示しようとしているのですがエラーが出て表示されません。原因がおわかりの方ご教示ください。

FormにButton1とWebBrowser1を配置しています。実行後、ボタンを押したらWebBrowser1に国土地理院の地図を表示したいのですが ”このページのスクリプトでエラーが発生しました。”と言うエラーメッセージが出力されます。スクリプトを実行すると ”エラー:'ol'は定義されていません。”と表示されてしまいます。

以下にソースをのせますのでご教示ください。
↓ソース

Public Class Form1
Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
'電子国土地図表示
WebBrowser1.DocumentText = TestOpenLayer()
End Sub

Private Function TestOpenLayer() As String

        Dim txtHtml As String = ""

        txtHtml = txtHtml & "<!doctype html>" & vbCrLf
        txtHtml = txtHtml & "<html lang='ja'>" & vbCrLf
        txtHtml = txtHtml & "<head>" & vbCrLf
        txtHtml = txtHtml & "    <meta charset='utf-8' />" & vbCrLf
        txtHtml = txtHtml & "    <link rel=""stylesheet"" href=""https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css"" type=""text/css"">" & vbCrLf
        txtHtml = txtHtml & "    <script src=""https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js""></script>" & vbCrLf
        txtHtml = txtHtml & "    <script type='text/javascript'>" & vbCrLf
        txtHtml = txtHtml & "var __map = null;" & vbCrLf
        txtHtml = txtHtml & "var __map = null;" & vbCrLf
        txtHtml = txtHtml & "function loadMap() {" & vbCrLf
        txtHtml = txtHtml & "    var _stdLayer = new ol.layer.Tile({" & vbCrLf
        txtHtml = txtHtml & "                source: new ol.source.XYZ({" & vbCrLf
        txtHtml = txtHtml & "                   url: 'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png'" & vbCrLf
        txtHtml = txtHtml & "                })" & vbCrLf
        txtHtml = txtHtml & "    });" & vbCrLf
        txtHtml = txtHtml & "    __map = new ol.Map({" & vbCrLf
        txtHtml = txtHtml & "        target: 'map'," & vbCrLf
        txtHtml = txtHtml & "        layers: [" & vbCrLf
        txtHtml = txtHtml & "            _stdLayer" & vbCrLf
        txtHtml = txtHtml & "        ]," & vbCrLf
        txtHtml = txtHtml & "        view: new ol.View({" & vbCrLf
        txtHtml = txtHtml & "            center: ol.proj.fromLonLat([139.745433, 35.658581])," & vbCrLf
        txtHtml = txtHtml & "            zoom: 15" & vbCrLf
        txtHtml = txtHtml & "        })" & vbCrLf
        txtHtml = txtHtml & "    });" & vbCrLf
        txtHtml = txtHtml & "}" & vbCrLf
        txtHtml = txtHtml & "</script>" & vbCrLf
        txtHtml = txtHtml & "    <style>" & vbCrLf
        txtHtml = txtHtml & "        #map {" & vbCrLf
        txtHtml = txtHtml & "            width: 600px;" & vbCrLf
        txtHtml = txtHtml & "            height: 400px;" & vbCrLf
        txtHtml = txtHtml & "        }" & vbCrLf
        txtHtml = txtHtml & "    </style>" & vbCrLf
        txtHtml = txtHtml & "</head>" & vbCrLf
        txtHtml = txtHtml & "<body onload='loadMap();'>" & vbCrLf
        txtHtml = txtHtml & "    <div id='map'></div>" & vbCrLf
        txtHtml = txtHtml & "</body>" & vbCrLf
        txtHtml = txtHtml & "</html>" & vbCrLf

        TestOpenLayer = txtHtml

    End Function
End Class


※教えてgooの方にも投稿しました。アドバイスを頂いて試してみたのですが解決には至っておりません。https://oshiete.goo.ne.jp/mypage/history/question/


尚TestOpenLayerの内容でhtmlファイルを作成しブラウザ(Chrome)では動作する事は確認しています。

以上、宜しくお願いします。