百度地图API使用方法详解，api使用方法详解

Jadual Kandungan

Rumah

pembangunan bahagian belakang

tutorial php

百度地图API使用方法详解，api使用方法详解_PHP教程

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jul 13, 2016 am 09:44 AM

api Peta Baidu api peta Baidu

百度地图API使用方法详解，api使用方法详解

最近做了个项目，其中项目中有个需求需要用到百度地图进行导航，通过查阅相关资料参考百度地图api完成了一个例子。

示例一：

API地址：http://developer.baidu.com/map/jsdemo.htm#a1_2

<!DOCTYPE html>
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 <style type="text/css">
 body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
 </style>
 <!--调用百度api -->
 <script type="text/javascript" src="http://api.map.baidu.com/api&#63;v=2.0&ak=你的密钥"></script> 
 <title>地图展示</title>
</head>
<body>
 <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
 // 百度地图API功能
 var map = new BMap.Map("allmap"); // 创建Map实例
 map.centerAndZoom("西安", 5);  // 初始化地图,用城市名设置地图中心点
 map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
 map.setCurrentCity("深圳");   // 设置地图显示的城市 此项是必须设置的
 map.enableScrollWheelZoom(true);  //开启鼠标滚轮缩放
 var point = new BMap.Point(116.404, 39.915);
 var marker = new BMap.Marker(point); // 创建点
 map.addOverlay(marker); //添加点
 map.removeOverlay(marker); //删除点
 // 创建地址解析器实例
 var myGeo = new BMap.Geocoder();
 //批量解析
 var adds = ["长沙", "深圳", "香港", "郑州 ", "惠州", "南昌", "赣州", "中山", "阳江", "上海", "无锡", "南京"];
 for (var i = 0; i < adds.length; i++) {
  myGeo.getPoint(adds[i], function (point) {
   if (point) {
    var address = new BMap.Point(point.lng, point.lat);
    var marker = new BMap.Marker(address);
    map.addOverlay(marker);
    var opts = {
     width: 120,  // 信息窗口宽度
     height: 70,  // 信息窗口高度
     title: "项目信息" // 信息窗口标题
    }
    var infoWindow = new BMap.InfoWindow("<a href='#' target='blank'>查看详情</a>", opts); // 创建信息窗口对象
    marker.addEventListener("click", function () {
     map.openInfoWindow(infoWindow,address); //开启信息窗口
    });
   }
  }, "深圳市");
 }
 getBoundary("中国");
 function getBoundary(sRegion) {
  var bdary = new BMap.Boundary();
  bdary.get(sRegion, function (rs) { //获取行政区域
   var count = rs.boundaries.length; //行政区域的点有多少个
   for (var i = 0; i < count; i++) {
    var ply = new BMap.Polygon(rs.boundaries[i], { strokeWeight: 2, strokeColor: "#4A7300", fillColor: "#FFF8DC" }); //建立多边形覆盖物
    map.addOverlay(ply); //添加覆盖物
   }
  });
 }
</script>

Salin selepas log masuk

效果如下：

示例二：

百度地图API是由JavaScript语言编写的，在使用之前需要将API引用到页面中：现在新版本的需要密钥，下面用的是旧版的

显示广州火车站简单实例：

<!DOCTYPE html> 
<html> 
<head> 
 <meta charset="utf-8"/> 
 <title>百度地图API的使用</title> 
 <!-- 百度地图API-->
 <script src="http://api.map.baidu.com/api&#63;v=1.2" type="text/javascript"></script> 
 <script type="text/javascript"> 
 function initialize() { 
  //创建地图实例 
  var map = new BMap.Map('map'); 
  //创建一个坐标
  var point =new BMap.Point(113.264641,23.154905);
  //地图初始化，设置中心点坐标和地图级别 
  map.centerAndZoom(point,15); 
 } 
 window.onload = initialize; 
 </script> 
</head> 
<body> 
<!-- 百度地图地图容器-->
 <div id="map" style="width:500px;height:320px"></div> 
</body> 
</html>

Salin selepas log masuk

地图上添加控件：

//添加控件

map.addControl(new BMap.MapTypeControl());

MapTypeControl ---------地图类型控件

CopyrightControl --------版权控件

ScaleControl --------比例尺控件

NavigationControl ------缩放控件

OverviewMapControl ----缩略图控件

创建标注：

1 2	`var` `marker =` `new` `BMap.Marker(point);` 　　　　　 `// 创建标注` `map.addOverlay(marker);` `// 将标注添加到地图中`

Salin selepas log masuk

创建信息窗口：

1 2	`var` `infoWindow =` `new` `BMap.InfoWindow("I am here");` `// 创建信息窗口对象` `map.openInfoWindow(infoWindow,point);` `//开启信息窗口`

Salin selepas log masuk

百度地图偏移量：

经度校正值： 0.008774687519;

纬度校正值： 0.00374531687912;

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

Menjana ai hentai secara percuma.

Tunjukkan Lagi

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)

2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Repo: Cara menghidupkan semula rakan sepasukan

1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Hello Kitty Island Adventure: Cara mendapatkan biji gergasi

4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Berapa lama masa yang diperlukan untuk mengalahkan fiksyen berpecah?

3 minggu yang lalu By DDD

R.E.P.O. Simpan Fail Lokasi: Di manakah & bagaimana untuk melindunginya?

4 minggu yang lalu By DDD

Tunjukkan Lagi

Alat panas

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Tunjukkan Lagi

Topik panas

Di manakah pintu masuk log masuk untuk e-mel gmail?

7356

Tutorial Java

1628

Tutorial CakePHP

1353

Tutorial Laravel

1265

Tutorial PHP

1214

Tunjukkan Lagi

Related knowledge

Cara membayar untuk menaiki teksi di Peta Baidu Pengenalan kepada langkah pembayaran untuk menaiki teksi. Mar 13, 2024 am 10:04 AM

Baidu Map APP kini telah menjadi perisian navigasi perjalanan pilihan untuk ramai pengguna, jadi beberapa fungsi di sini adalah komprehensif dan boleh dipilih dan dikendalikan secara percuma untuk menyelesaikan beberapa masalah yang mungkin anda hadapi dalam perjalanan harian Anda boleh menyemak beberapa daripadanya laluan perjalanan anda sendiri, rancang beberapa pelan perjalanan anda sendiri, dan selepas menyemak laluan yang sepadan, anda boleh memilih kaedah perjalanan yang sesuai mengikut keperluan anda sendiri Jadi sama ada anda memilih beberapa pengangkutan awam, Berbasikal, berjalan kaki atau menaiki teksi semuanya boleh memuaskan keperluan anda. Terdapat laluan navigasi yang sesuai yang boleh membawa anda ke tempat tertentu Kemudian semua orang akan berasa lebih selesa jika mereka memilih untuk menaiki teksi menjadi super

Cara menambah lokasi baharu dalam Peta Baidu Mar 20, 2024 pm 01:46 PM

Jika anda ingin menambah lokasi baharu pada Peta Baidu, anda mungkin perlu melalui beberapa langkah yang rumit. Tetapi jangan risau, saya akan memberi anda pengenalan terperinci tentang cara menambahkan tempat baharu pada Peta Baidu, menjadikannya lebih mudah untuk anda berkongsi maklumat lokasi anda atau membantu orang lain mencari destinasi mereka. Cara menambah lokasi baharu pada Peta Baidu 1. Mula-mula buka APP Peta Baidu dan masukkan halaman utama 2. Kemudian masukkan halaman utama seperti yang ditunjukkan di bawah dan klik butang [Laporan] di sebelah kanan; halaman fungsi pelaporan , pilih perkhidmatan [Tambah Lokasi] di bawah 4. Kemudian masukkan maklumat dalam kotak [Maklumat Lain] dalam kawasan Tambah Lokasi 5. Akhir sekali masukkan maklumat yang sepadan dan klik [Hantar] di bahagian bawah untuk melengkapkan;

Cara membayar teksi di 'Peta Baidu' Mar 26, 2024 pm 09:20 PM

Dalam perjalanan harian, kita selalunya perlu menaiki teksi, dan kini Baidu Maps turut menyediakan perkhidmatan teksi, yang mudah dan pantas. Walau bagaimanapun, ramai orang masih tidak tahu cara membayar selepas menaiki teksi di Peta Baidu. Di bawah, kami akan memperkenalkan secara terperinci cara membayar teksi di Peta Baidu. Cara membayar teksi di Peta Baidu 1. Mula-mula buka APP Peta Baidu dan masukkan halaman utama 2. Kemudian lompat ke halaman yang ditunjukkan dalam gambar di bawah dan klik [Teksi] di sebelah kanan; halaman fungsi dalam gambar di bawah , pilih [Pusat Peribadi]; Pergi ke Aktifkan].

Bagaimana untuk melihat peta kehidupan sebenar 3D Peta Baidu Feb 23, 2024 pm 12:52 PM

Peta Baidu mempunyai fungsi peta kehidupan sebenar 3D, jadi bagaimana untuk melihat peta kehidupan sebenar 3D Pengguna perlu mencari lebih banyak pilihan dalam Saya, dan kemudian mencari peta 3D di dalamnya untuk melihat peta. Pengenalan kepada kaedah melihat peta kehidupan sebenar 3D ini boleh memberitahu anda cara menyediakannya. Berikut ialah pengenalan terperinci, jadi sila lihat. Tutorial penggunaan Peta Baidu Cara melihat peta kehidupan sebenar 3D Peta Baidu Jawapan: Pergi ke Peta 3D Saya-Lagi-Kaedah khusus: Versi mudah alih: 1. Mula-mula, klik Saya di sebelah kanan bawah. 2. Cari lebih banyak fungsi di dalam. 3. Klik pada adegan sebenar 3D untuk menggunakannya. Versi web: 1. Pertama, anda perlu memasukkan https://map.baidu.com untuk memasuki versi web. 2. Klik Kaedah Lihat di penjuru kanan sebelah bawah.

Navigasi peringkat lorong Peta Baidu meliputi 200 bandar di seluruh negara untuk meningkatkan pengalaman pemanduan Feb 03, 2024 pm 03:05 PM

Peta Baidu baru-baru ini mengumumkan bahawa mereka telah berjaya melancarkan sistem navigasi peringkat lorong bandar yang benar, yang meliputi lebih daripada 200 bandar di seluruh negara. Pengenalan sistem ini telah banyak meningkatkan pengalaman navigasi pemandu. Navigasi peringkat lorong Peta Baidu menyediakan antara muka yang lebih mengasyikkan dan tiga dimensi berbanding kaedah navigasi sebelumnya yang hanya menyediakan imej yang diperbesarkan. Sistem ini membolehkan pemandu mempunyai pemahaman yang lebih jelas tentang keadaan jalan raya semasa dengan memulihkan butiran jalan dunia sebenar, seperti lampu isyarat, garis pemisah lorong dan lorong bas. Navigasi peringkat lorong jenis ini bukan sahaja dapat membantu pemandu memilih lorong dengan lebih tepat, tetapi juga menyediakan maklumat trafik yang lebih komprehensif, menjadikan proses pemanduan lebih selamat dan mudah. Difahamkan bahawa untuk mencapai matlamat ini, Peta Baidu membangunkan model penjanaan peta berskala besar pertama industri secara bebas.

Cara melihat paparan jalan masa nyata 3D pada Peta Baidu Cara melihat paparan jalan masa nyata 3D Mar 28, 2024 pm 03:20 PM

Baidu Map Navigation versi mudah alih muat turun percuma ialah perisian navigasi peta mudah alih yang sangat profesional Fungsi navigasi dalam perisian ini sangat berkuasa selagi anda mahu pergi, anda boleh mencari pelan perjalanan yang paling tepat anda ingin pergi Pada masa yang sama, anda juga boleh menggunakan fungsi navigasi lain Anda boleh memuat turun dan menggunakan pek suara pelbagai selebriti secara percuma Pelbagai mod navigasi boleh digunakan dalam talian untuk melindungi keselamatan perjalanan semua orang kod untuk menaiki bas dengan lebih mudah Ia adalah pembantu navigasi perjalanan yang mesti ada, jangan risau tentang tersesat, kini editor dengan teliti akan memperkenalkan kepada rakan kongsi Peta Baidu cara melihat paparan jalan masa nyata dalam talian. 1. Buka Peta Baidu dan klik Lagi dalam bar fungsi biasa 2. Kemudian cari untuk mencari pemandangan sebenar 3D. Kemudian masukkan antara muka paparan 3D

Moore Threads menandatangani kerjasama strategik dengan Peta Baidu untuk mencipta generasi baharu peta berkembar digital Jul 25, 2024 am 12:31 AM

Laman web ini melaporkan pada 24 Julai bahawa baru-baru ini, Moore Thread dan Baidu Maps telah menandatangani perjanjian kerjasama strategik Kedua-dua pihak akan memanfaatkan kelebihan masing-masing dalam teknologi dan produk untuk bersama-sama mempromosikan inovasi teknologi dalam peta berkembar digital. Menurut perjanjian kerjasama, kedua-dua pihak akan memberi tumpuan kepada pembinaan projek peta berkembar digital, mengambil kesempatan daripada kelebihan enjin peta Baidu Map, kelebihan teknologi kembar digital, kelebihan aplikasi data besar peta, dan pemaparan grafik 3D dan teknologi pengkomputeran AI. kelebihan GPU berciri penuh benang Moore untuk secara aktif melaksanakan kerjasama berterusan yang mendalam dan meluas akan bersama-sama mempromosikan aplikasi dan pelaksanaan berskala besar bagi penyelesaian peta berkembar digital. Menurut pengenalan rasmi Moore Thread, data peta ialah aset utama negara, dan peta berkembar digital terutamanya menyerlahkan kepentingannya dalam senario pemaparan muatan tinggi, yang mempunyai kesan ketara pada prestasi pemaparan dan prestasi GPU.

Cara menanda berbilang lokasi pada Peta Baidu Bagaimana untuk menanda berbilang lokasi Mar 15, 2024 pm 04:28 PM

Terdapat banyak fungsi di atas, terutamanya untuk peta yang boleh menandakan berbilang tempat Apabila kami mengetahui beberapa tempat, kami pasti akan menggunakan beberapa fungsi tanda baca, supaya kami boleh membawakan anda pelbagai aspek yang berbeza. itu, anda boleh tahu sejauh mana mereka sudah tentu beberapa nama dan maklumat terperinci tempat di atas juga akan dipaparkan , jadi untuk membolehkan semua orang membuat pilihan yang lebih baik dalam pelbagai aspek, hari ini editor akan membawakan anda beberapa pilihan dalam pelbagai aspek, jadi rakan-rakan yang berminat dengan idea, Jika anda juga berminat, datang dan mencubanya. Standard

See all articles