2017-06-17 2 views
-1

Google Map with KMLを表示するC#WebBrowserを含むWindowsフォームを作成したいとします。問題は、コードを実行した後、Webブラウザに何も表示されないということです。私は私のプロジェクトにこれが必要です。ここでC#WebBrowserのKMLを使用したGoogleマップ

は私のコードです:

namespace WindowsFormsApplication1 
{ 
    public partial class Form1 : Form 
    { 
     public Form1() 
     { 
      InitializeComponent(); 
     } 

     private void Form1_Load(object sender, EventArgs e) 
     { 
      webBrowser123.DocumentText = 
    "<!DOCTYPE html>" + 
"<html>" + 
    "<head>" + 
    "<meta name=\"viewport\" content=\"initial-scale=1.0\">" + 
    "<meta charset=\"utf-8\">" + 
    "<title>KML Layers</title>" + 
    "<style>" + 
       /* Always set the map height explicitly to define the size of the div 
       * element that contains the map. */ 
     "#map {" + 
     " height: 100%;" + 
     "}" + 
       /* Optional: Makes the sample page fill the window. */ 
     "html, body {" + 
     "height: 100%;" + 
     "margin: 0;" + 
     "padding: 0;" + 
    " }" + 
    "</style>" + 
    "</head>" + 
    "<body>" + 
    " <div id=\"map\"></div>" + 
    "<script>" + 

     "function initMap() {" + 
     " var map = new google.maps.Map(document.getElementById('map'), {" + 
     " zoom: 11," + 
      "center: {lat: 41.876, lng: -87.624}" + 
     " });" + 

     " var ctaLayer = new google.maps.KmlLayer({" + 
     " url: 'http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml'," + 
     " map: map" + 
     " });" + 
    " }" + 
    "</script>" + 
    "<script async defer" + 
    "src=\"https://maps.googleapis.com/maps/api/js?key=AIzaSyAsLmzxet8OI2SHDZ78c3MJdTP1ODoFjZg&callback=initMap\">" + 
    "</script>" + 
    "</body>" + 
"</html>"; 
    //  webBrowser.DocumentText = 
    //"<html><body>Please enter your name:<br/>" + 
    //"<input type='text' name='userName'/><br/>" + 
    //"<a href='http://www.microsoft.com'>continue</a>" + 
    //"</body></html>"; 
     } 
    } 
} 

答えて

1

私はhttp://www.buildmystring.com/と私のHTMLコードを変換し、今ではすべてが正常に動作します。誰かがそれを必要とする場合は、私の作業コードです:

 private void Form1_Load(object sender, EventArgs e) 
     { 


      label1.Text = "Width:" + webBrowser123.Width + " Height: " + webBrowser123.Height; 
      // BuildMyString.com generated code. Please enjoy your string responsibly. 

StringBuilder sb = new StringBuilder(); 

sb.Append("<!DOCTYPE html>"); 
sb.Append("<html>"); 
sb.Append(" <head>"); 
sb.Append(" <meta name=\"viewport\" content=\"initial-scale=1.0\">"); 
sb.Append(" <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">"); 
sb.Append(" <meta charset=\"utf-8\">"); 
sb.Append(" <title>KML Layers</title>"); 
sb.Append(" <style>"); 
sb.Append("  /* Always set the map height explicitly to define the size of the div"); 
sb.Append("  * element that contains the map. */"); 
sb.Append("  #map {"); 
sb.Append("  height: 100%;"); 
sb.Append("  }"); 
sb.Append("  /* Optional: Makes the sample page fill the window. */"); 
sb.Append("  html, body {"); 
sb.Append("  height: 100%;"); 
sb.Append("  margin: 0;"); 
sb.Append("  padding: 0;"); 
sb.Append("  }"); 
sb.Append(" </style>"); 
sb.Append(" </head>"); 
sb.Append(" <body>"); 
sb.Append(" <div id=\"map\"></div>"); 
sb.Append(" <script>"); 
sb.Append(""); 
sb.Append("  function initMap() {"); 
sb.Append("  var map = new google.maps.Map(document.getElementById('map'), {"); 
sb.Append("   zoom: 11,"); 
sb.Append("   center: {lat: 41.876, lng: -87.624}"); 
sb.Append("  });"); 
sb.Append(""); 
sb.Append("  var ctaLayer = new google.maps.KmlLayer({"); 
sb.Append("   url: 'https://new.enfield.gov.uk/Cemeteries.kml',"); 
sb.Append("   map: map"); 
sb.Append("  });"); 
sb.Append("  }"); 
sb.Append(" </script>"); 
sb.Append(" <script async defer"); 
sb.Append(" src=\"https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&callback=initMap&v=3.22\">"); 
sb.Append(" </script>"); 
sb.Append(" </body>"); 
sb.Append("</html>"); 



webBrowser123.DocumentText = sb.ToString(); 


     } 

関連する問題