本文為英文版的機器翻譯版本,如內容有任何歧義或不一致之處,概以英文版為準。
如何建立物流地圖
TravelModes 功能可讓您使用 Amazon Location Service 建置物流地圖。TravelModes 會顯示具有相關道路限制的 Truck 導航相關路由資訊。使用 Transit TravelMode 來顯示公有運輸詳細資訊。
使用 Truck TravelMode 建立地圖
此範例示範如何使用 建立邏輯路由TruckTravelMode的映射。
- index.html
-
<!DOCTYPE html>
<html lang="en">
<head>
<title>Truck Map</title>
<meta charset='utf-8'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel='stylesheet' href='https://unpkg.com/maplibre-gl@5.x/dist/maplibre-gl.css' />
<script src='https://unpkg.com/maplibre-gl@5.x/dist/maplibre-gl.js'></script>
</head>
<body style="margin: 0; padding: 0;">
<div id="map" style="width: 100%; height: 100vh;"></div>
<script>
const apiKey = "Add Your Api Key";
const mapStyle = "Standard";
const awsRegion = "us-east-1";
const map = new maplibregl.Map({
container: 'map',
style: `https://maps.geo.${awsRegion}.amazonaws.com/v2/styles/${mapStyle}/descriptor?travel-modes=Truck&key=${apiKey}`,
center: [-74.0060 ,40.7128],
zoom: 12,
validateStyle: false, // Disable style validation for faster map load
});
</script>
</body>
</html>
- style.css
-
body {
margin: 0;
padding: 0;
}
#map {
width: 100%;
height: 100vh;
}