Fatal编程技术网
  • javascript/
  • Javascript .Net windows应用程序WebBrowser/Google地图API v3

Javascript .Net windows应用程序WebBrowser/Google地图API v3

javascript .net visual-studio maps browser

Javascript .Net windows应用程序WebBrowser/Google地图API v3,javascript,.net,visual-studio,maps,browser,Javascript,.net,Visual Studio,Maps,Browser,我正在开发一个应用程序，用户可以在其中输入所需的地址，然后按下按钮。此地址将在.net windows应用程序中的WebBrowser控件上找到。我知道您可以使用WebBrowser1.DocumentText在WebBrowser上运行javascripts，并通过WebBrowser1.Document.InvokeScript调用脚本 我有点小问题，我想知道是否有人可以告诉我正确的方法，以便做到这一点 代码： Private Sub Button1_Click(sender As Syst

我正在开发一个应用程序，用户可以在其中输入所需的地址，然后按下按钮。此地址将在.net windows应用程序中的
WebBrowser
控件上找到。我知道您可以使用
WebBrowser1.DocumentText
在
WebBrowser
上运行javascripts，并通过
WebBrowser1.Document.InvokeScript
调用脚本

我有点小问题，我想知道是否有人可以告诉我正确的方法，以便做到这一点

代码：

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

  Dim AddressMap As String

  AddressMap = AddressM.Text

  WebBrowser1.DocumentText = "<html><head><meta name='viewport' content='initial-scale=1.0, user-scalable=no' />" & _
    "<script type='text/javascript' src='http://maps.google.com.mx/maps/api/js?sensor=true&language;=es'></script>" & _
    "<script type='text/javascript'>" & _
    "var geocoder; var map;" & _
    "function initialize() " & _
    "{geocoder = new google.maps.Geocoder(); var myOptions = { zoom: 16, mapTypeId: google.maps.MapTypeId.ROADMAP()" & _
    "} var(address = " & AddressMap & ")" & _
    "geocoder.geocode({ 'address': address }, function (results, status) {" & _
                    "if (status == google.maps.GeocoderStatus.OK) {" & _
                        "map.setCenter(results[0].geometry.location);" & _
                        "var marker = new google.maps.Marker({" & _
                           " map: map," & _
                            "position: results[0].geometry.location });" & _
                    "} else {" & _
                    "}});" & _
     "map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);}" & _
     "</script></head><div id='map_canvas' style='width:100%; height:100%'></div></body></html>"

   WebBrowser1.Document.InvokeScript("Initialize")

End Sub

Private子按钮1\u单击（发送方作为System.Object，e作为System.EventArgs）处理按钮1。单击
Dim AddressMap作为字符串
AddressMap=AddressM.Text
WebBrowser1.DocumentText=”“&_
"" & _
"" & _
“var地理编码器；var地图；”和_
“函数初始化（）”&_
“{geocoder=new google.maps.geocoder（）；var myOptions={zoom:16，mapTypeId:google.maps.mapTypeId.ROADMAP（）”&_
“}var（address=“&AddressMap&”）和_
geocoder.geocode（{'address'：address}，函数（结果、状态）{_
如果（status==google.maps.GeocoderStatus.OK）{_
“map.setCenter（结果[0].geometry.location）；”&_
var marker=newgoogle.maps.marker（{“&_
“地图：地图，&”_
“位置：结果[0].geometry.location}）；”&_
“}否则{”和_
"}});" & _
“map=new google.maps.map（document.getElementById（'map_canvas'），myOptions）；}”和_
""
WebBrowser1.Document.InvokeScript（“初始化”）
端接头
下面是另一段代码，我认为应该可以工作，但我仍然得到一个脚本错误“此页面上的脚本中发生了一个错误”第1行CHar 124 error Expected'；'代码0 URL about.blank

 WebBrowser1.DocumentText = "<html><head><script type='text/javascript' src='http://maps.google.com.mx/maps/api/js?sensor=false&language;=es'></script> " +
                           "<script type='text/javascript'> " +
                           "var geocoder; " +
                           "var map; " +
                           "function initialize(address) { " +
                           "geocoder = new google.maps.Geocoder(); " +
                           "var myOptions = { zoom: 16 } " +
                           "geocoder.geocode({ 'address': address }, function (results, status) { map.setCenter(results[0].geometry.location); " +
                           "var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location }); " +
                           "map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); " +
                           "} " +
                           "</script> " +
                           "</head> " +
                           "<body> <div id='map_canvas' style='width:100%; height:100%'></div> </body> </html>"

WebBrowser1.Document.InvokeScript("initialize", New String() {AddressM.Text})

WebBrowser1.DocumentText=“”+
" " +
“地理编码器”+
“变量映射；”+
“函数初始化（地址）{”+
“geocoder=新建google.maps.geocoder（）；”+
“var myOptions={zoom:16}”+
geocoder.geocode（{'address'：address}，函数（结果，状态）{map.setCenter（结果[0].geometry.location）；“+
var marker=new google.maps.marker（{map:map，position:results[0].geometry.location}）+
map=new google.maps.map（document.getElementById（'map_canvas'），myOptions）+
"} " +
" " +
" " +
"   "
WebBrowser1.Document.InvokeScript（“初始化”，新字符串（）{AddressM.Text}）
我非常感谢你的帮助

利奥p

这是另一段与前两段稍有不同的代码，它包括从实际运行GoogleMaps脚本的html中提取的if-else语句

WebBrowser1.DocumentText = "<html><head><script type='text/javascript' src='http://maps.google.com.mx/maps/api/js?sensor=false&language;=es'></script> " +
                       "<script type='text/javascript'> " +
                       "var geocoder; " +
                       "var map; " +
                       "function initialize() { " +
                       "geocoder = new google.maps.Geocoder(); " +
                       "var myOptions = { zoom: 16, mapTypeId: google.maps.MapTypeId.ROADMAP } " +
                       "var(address = 'Miami Beach, Flordia') " +
                       "geocoder.geocode({ 'address': address }, " +
                       "function (results, status) { " +
                       "if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); " +
                       "var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location }); " +
                       "} else { alert('Geocode was not successful !);}}); " +
                       "map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); } " +
                       "</script> " +
                       "</head> " +
                       "<body> <div id='map_canvas' style='width:100%; height:100%'></div> </body> </html>"

        WebBrowser1.Document.InvokeScript("initialize")

WebBrowser1.DocumentText=“”+
" " +
“地理编码器”+
“变量映射；”+
“函数初始化（）{”+
“geocoder=新建google.maps.geocoder（）；”+
var myOptions={zoom:16，mapTypeId:google.maps.mapTypeId.ROADMAP}+
var（地址='佛罗里达州迈阿密海滩'）+
geocoder.geocode（{'address'：address}）+
函数（结果、状态）{+
“如果（status==google.maps.GeocoderStatus.OK）{map.setCenter（results[0].geometry.location）；”+
var marker=new google.maps.marker（{map:map，position:results[0].geometry.location}）+
“}else{alert（'Geocode未成功！）；}}}”+
map=new google.maps.map（document.getElementById（'map_canvas'），myOptions）；}+
" " +
" " +
"   "
WebBrowser1.Document.InvokeScript（“初始化”）
下面是html代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

<script type="text/javascript" src="http://maps.google.com.mx/maps/api/js?sensor=true&language=es"></script>
<script type="text/javascript">

    var geocoder;
    var map;


    function initialize() {

        geocoder = new google.maps.Geocoder();

        var myOptions = {
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }

        //var address = document.getElementById("address").value;
        var address = "Miami Beach, Flordia" //change the address in order to search the google maps

        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }


    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>

  </body>
</html>


var地理编码器；
var映射；
函数初始化（）{
geocoder=新的google.maps.geocoder（）；
变量myOptions={
缩放：16，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
//var address=document.getElementById（“地址”）.value；
var address=“迈阿密海滩，弗洛迪亚”//更改地址以搜索谷歌地图
geocoder.geocode（{'address'：address}，函数（结果，状态）{
if（status==google.maps.GeocoderStatus.OK）{
map.setCenter（结果[0].geometry.location）；
var marker=new google.maps.marker({
地图：地图，
位置：结果[0]。几何体。位置
});
}否则{
警报（“地理编码因以下原因未成功：“+状态”）；
}
});
map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
}
放置解决方案

HTML

在C:\page.html中创建页面html，并使用以下代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

<script type="text/javascript" src="http://maps.google.com.mx/maps/api/js?sensor=true&language=es"></script>
<script type="text/javascript">

    var geocoder;
    var map;


    function initialize(address) {

        geocoder = new google.maps.Geocoder();

        var myOptions = {
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }

        geocoder.geocode({ 'address': (address ? address : "Miami Beach, Flordia")}, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }


    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>

  </body>
</html>
并且需要具有以下名称的组件的表单：
textBox1
，
button1
和
webBrowser1
，

我尝试了您的解决方案，但收到错误“此页面上的脚本中发生了错误。”，有没有一种方法可以使代码不在一行中而是分开？我从原始代码中获取代码，这是我从html中获取代码的完整代码。@TopoX我更正了代码。地址中有逗号。显然代码现在还可以。我仍然不知道如何在.net webbrowser上运行此代码control@TopoXonload脚本没有运行吗？ 
private void Form1_Load(object sender, EventArgs e)
{
    // Put uri (http://www.example.com/page.html and c:\page.html is valid address)
    webBrowser1.Url = new Uri(@"C:\page.html");
}

private void button1_Click(object sender, EventArgs e)
{
    webBrowser1.Document.InvokeScript("initialize", 
            new string[] { textBox1.Text });
}