API - Distance Matrix
使用NextBillion.ai Maps API，你可以仅仅使用数行代码从地图数据中获取所有类型的服务以支持你的业务场景。
在本节中，我们将会介绍Distance Matrix API.
The Distance Matrix API 需要输入若干个位置信息作为起点和目的地，它将会返回相邻两个位置间的距离。你可以设置各种选项，比如出行方式，以获得更为准确的距离结果。
你可以使用SDK中的内置方法来请求并渲染结果。如果必要的话，你也可以手动处理和可视化这些数据。
在Distance Matrix的参考文档中有更为详细的介绍。
1<!DOCTYPE html>
2<html lang="en">
3 <head>
4 <meta charset="UTF-8" />
5 <title>NBMap Basic Example</title>
6 <link href="https://maps-gl.nextbillion.io/maps/api/css" rel="stylesheet" />
7 <style>
8 * {
9 margin: 0;
10 padding: 0;
11 }
12 #map {
13 width: 100vw;
14 height: 100vh;
15 }
16 </style>
17 </head>
18 <body>
19 <div id="map"></div>
20 <script src="https://maps-gl.nextbillion.io/maps/api/js"></script>
21 <script>
22 ;(function () {
23 nextbillion.setApiKey('your-api-key')
24 // 可选项：你可以设置API的host，如果它不是"api.nextbillion.io"
25 nextbillion.setApiHost('your-api-endpoint')
26 var map = new nextbillion.maps.Map(document.getElementById('map'), {
27 zoom: 12,
28 center: { lat: 28.6139, lng: 77.209 },
29 })
30
31 async function requestDistanceMatrix() {
32 var resp = await nextbillion.api.DistanceMatrix({
33 origins: [
34 { lat: 13.01751434, lng: 77.60704545 },
35 { lat: 13.00580657, lng: 77.61116532 },
36 { lat: 13.00396673, lng: 77.63142137 },
37 ],
38 destinations: [
39 { lat: 12.9720182, lng: 77.55005387 },
40 { lat: 12.95963913, lng: 77.64738587 },
41 { lat: 12.93789063, lng: 77.61339692 },
42 ],
43 mode: '4w',
44 })
45
46 requestDistanceMatrix()
47
48 // 在浏览器控制台中确认接口的返回信息
49 console.log(resp)
50 }
51 })()
52 </script>
53 </body>
54</html>Make a Map
