一、申請金鑰

如上圖所示:使用百度地圖的API首先要申請一個金鑰，應用名稱隨便填寫，應用型別選擇瀏覽器，白名單填寫符號 *   ，之後提交後會獲得一個金鑰。

二、新建winform工程

1、新建一個winform工程

2、在winform下新增一個HTML頁面

解決方案資源管理器 -  右鍵 - 新增  -新建項  新增HTML頁

3、編寫winform工程

（1）新增一個WebBrowser控制元件到視窗中，用來顯示web頁面內容。

（2）修改winfrom後端

1）執行HTML需要新增一個名稱空間

using System.Security.Permissions;
 

2）在主視窗類中新增JS執行的必要程式碼

  
   [PermissionSet(SecurityAction.Demand, Name = "FullTrust")]//呼叫JS程式碼必要
    [System.Runtime.InteropServices.ComVisibleAttribute(true)]   
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void Form1_Load(object sender, EventArgs e)
        {
            try
            {
                string str_url = Application.StartupPath + "../HTMLPage1.html";// 新增自己新增的html檔名，注意使用相對路徑的方法 HTMLPage1.html要複製到debug目錄下
                Uri url = new Uri(str_url);
                webBrowser1.Url = url;
                webBrowser1.ObjectForScripting = this;
            }
            catch (Exception ex)
            {
                MessageBox.Show(ex.Message, "異常", MessageBoxButtons.OK, MessageBoxIcon.Error);
            }
        }
}
 

（3）編寫HTML頁面

先試試百度地圖示例DEMO,如使用地圖展示功能。

只需要把上圖中的程式碼複製到自己的HTML裡，並將“您的金鑰” 替換成自己前面申請的金鑰即可。

（2）最後執行，即可在自己的winform視窗下實現該功能。

至此一個基本的呼叫百度地圖的功能已經實現，要想增加地圖的功能，可以參照百度地圖API提供的DEMO示例，對照開發手冊增加功能。

三、HTML與winfrom引數傳遞的實現

上面中HTML頁面與winform的後臺，沒有引數的傳遞，下面詳細講解winfrom後臺如何獲取HTML頁面的資料，如何呼叫HTML頁面下用JS編寫的函式以及函式引數傳遞的問題。

1、winfrom獲取HTML介面資料,並顯示在winfrom介面中

如：HTML獲取介面的滑鼠位置，變轉換成經緯度傳遞 winfrom後臺。並顯示。

（1）HTML下編寫滑鼠監聽事件，並獲取滑鼠位置對應的經緯度。

 //實時顯示地圖座標 strat
    map.addEventListener("mousemove", GetlngAndlat);
    function GetlngAndlat(e) {
        if (e.point.lng != null) {
            document.getElementById("mouselng").innerHTML = e.point.lng;
            document.getElementById("mouselat").innerHTML = e.point.lat;
        }
    }

（2）winfrom後端獲取前端的經緯度，並顯示。

這裡用一個定時器，定時器的中斷時間設定為1ms，中斷時顯示經緯度。

 //定時器中斷，顯示滑鼠的經緯度
        private void timer1_Tick(object sender, EventArgs e)
        {
            try
            {
                string tag_lng = webBrowser1.Document.GetElementById("mouselng").InnerText;  //獲取經緯度
                string tag_lat = webBrowser1.Document.GetElementById("mouselat").InnerText;
                double dou_lng, dou_lat;
                if (double.TryParse(tag_lng, out dou_lng) && double.TryParse(tag_lat, out dou_lat)) //字串轉double資料
                {
                    this.toolStripLabel1.Text = "當前座標：" + dou_lng.ToString("F5") + "," + dou_lat.ToString("F5");
                }
            }
            catch (Exception ee)
            {
                //MessageBox.Show(ee.Message); 
            }  
        }

2、winfrom呼叫HTML的JS函式，並傳遞引數

如後端傳送一個經緯度資訊傳遞到前端，並定位其對應的位置。

（1）前端編寫

 //winform傳入經緯度，並獲取地圖中心點
    function setLocation(x, y) {
        map.clearOverlays();
        var point = new BMap.Point(x, y);// 建立點座標(經度,緯度)
        // map.centerAndZoom(point, 11);
        var marker1 = new BMap.Marker(point);  // 建立標註
        map.addOverlay(marker1); // 給該座標加一個紅點標記
        map.panTo(point);

    }

（2）後端呼叫

        //外部查詢按鈕
        private void toolStripButton1_Click(object sender, EventArgs e)
        {
            //這裡傳入x、y的值，呼叫JavaScript指令碼
            webBrowser1.Document.InvokeScript("setLocation", new object[] { 121.504, 30 });
        }