เอกสารนี้ครอบคลุมวิธีปรับแต่งรูปลักษณ์ของแผนที่ รวมถึงวิธีควบคุมระดับการแชร์ข้อมูลและตัวเลือกวิวพอร์ต โดยคุณสามารถทำได้ดังนี้
- ใช้การจัดรูปแบบแผนที่ในระบบคลาวด์
- ตั้งค่าตัวเลือกรูปแบบแผนที่ในโค้ดของคุณเองโดยตรง
จัดรูปแบบแผนที่ด้วยการจัดรูปแบบแผนที่ในระบบคลาวด์
หากต้องการใช้รูปแบบแผนที่กับแผนที่การแชร์การเดินทางของผู้ใช้ JavaScript ให้ระบุ
mapIdและ
อื่นๆ
mapOptions
เมื่อสร้าง JourneySharingMapView
ตัวอย่างต่อไปนี้แสดงวิธีใช้รูปแบบแผนที่ด้วยรหัสแผนที่
JavaScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
mapId: 'YOUR_MAP_ID'
}
// Any other styling options.
});
TypeScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
mapId: 'YOUR_MAP_ID'
}
// Any other styling options.
});
จัดรูปแบบแผนที่ในโค้ดของคุณเองโดยตรง
นอกจากนี้ คุณยังปรับแต่งการจัดรูปแบบแผนที่ได้ด้วยการตั้งค่าตัวเลือกแผนที่เมื่อสร้าง JourneySharingMapView ตัวอย่างต่อไปนี้แสดงวิธีจัดรูปแบบแผนที่โดยใช้ตัวเลือกแผนที่ ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกแผนที่ที่ตั้งค่าได้ที่
mapOptions
ในเอกสารอ้างอิง Maps JavaScript API ของ Google Maps
JavaScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
styles: [
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{ "color": "#CCFFFF" }
]
}
]
}
});
TypeScript
const mapView = new google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
mapOptions: {
styles: [
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{ "color": "#CCFFFF" }
]
}
]
}
});
ควบคุมระดับการแชร์ข้อมูลงานกับ SDK
คุณสามารถควบคุมการมองเห็นออบเจ็กต์งานบางรายการบนแผนที่ได้โดยใช้กฎการมองเห็น
ระดับการแชร์เริ่มต้นของข้อมูลงาน
โดยค่าเริ่มต้น ข้อมูลของงานที่มอบหมายให้ยานพาหนะจะแสดงเมื่อยานพาหนะอยู่ห่างจากงานไม่เกิน 5 จุดแวะพัก ระดับการแชร์จะสิ้นสุดลงเมื่อมีการทำงานให้เสร็จสมบูรณ์หรือยกเลิกงาน
ตารางนี้แสดงระดับการแชร์เริ่มต้นสำหรับงานแต่ละประเภท คุณสามารถปรับแต่งระดับการแชร์สำหรับงานหลายประเภท แต่ไม่ใช่ทั้งหมด ดูรายละเอียดเพิ่มเติมเกี่ยวกับประเภทงาน ได้ที่หัวข้อประเภทงานในคู่มืองานที่กำหนดเวลาไว้
| ประเภทงาน | ระดับการแชร์เริ่มต้น | ปรับแต่งได้ไหม | คำอธิบาย |
|---|---|---|---|
| งานที่ไม่พร้อมให้บริการ | ไม่แสดง | ไม่ได้ | ใช้สำหรับช่วงพักและเติมน้ำมันของคนขับ หากเส้นทางไปยังงานจัดส่งมีจุดแวะพักของยานพาหนะอื่นด้วย ระบบจะไม่แสดงจุดแวะพักนั้นหากมีเฉพาะงานที่ไม่พร้อมให้บริการ ระบบจะยังคงแสดงเวลาถึงโดยประมาณ และเวลาเสร็จสมบูรณ์โดยประมาณของงานจัดส่ง |
| งานยานพาหนะที่เปิดอยู่ | แสดง | ได้ | ระดับการแชร์จะสิ้นสุดลงเมื่อมีการทำงานให้เสร็จสมบูรณ์หรือยกเลิกงาน คุณสามารถปรับแต่งการมองเห็นของงานยานพาหนะที่เปิดอยู่ได้ ดูหัวข้อ ปรับแต่งระดับการแชร์ของงานยานพาหนะที่เปิดอยู่ |
| งานยานพาหนะที่ปิดอยู่ | ไม่แสดง | ไม่ได้ | คุณไม่สามารถปรับแต่งระดับการแชร์ของงานยานพาหนะที่ปิดอยู่ได้ |
ปรับแต่งระดับการแชร์ของงานยานพาหนะที่เปิดอยู่
อินเทอร์เฟซ TaskTrackingInfo มีองค์ประกอบข้อมูลงานจำนวนมาก
ที่สามารถแสดงได้ด้วย Consumer SDK
| องค์ประกอบข้อมูลงานที่ปรับแต่งได้ | |
|---|---|
|
เส้นประกอบเส้นทาง เวลาถึงโดยประมาณ เวลาเสร็จสมบูรณ์โดยประมาณของงาน |
ระยะทางขับขี่ที่เหลือไปยังงาน จำนวนจุดแวะพักที่เหลือ ตำแหน่งของยานพาหนะ |
ตัวเลือกระดับการแชร์ต่องาน
คุณสามารถปรับแต่งการกำหนดค่าระดับการแชร์ต่องานได้โดยการตั้งค่า
the TaskTrackingViewConfig เมื่อสร้างหรืออัปเดตงานภายใน
Fleet Engine ใช้ตัวเลือกการมองเห็นต่อไปนี้เพื่อสร้างเกณฑ์ในการกำหนดการมองเห็นขององค์ประกอบงาน
| ตัวเลือกระดับการแชร์ | ||
|---|---|---|
|
จำนวนจุดแวะพักที่เหลือ ระยะเวลาจนกว่าจะถึงเวลาถึงโดยประมาณ ระยะทางขับขี่ที่เหลือ |
แสดงเสมอ ไม่แสดง |
|
ตัวอย่างเช่น สมมติว่าการปรับแต่งตัวอย่างจะปรับระดับการมองเห็นสำหรับองค์ประกอบข้อมูล 3 รายการโดยใช้เกณฑ์ที่แสดงในตารางต่อไปนี้ องค์ประกอบอื่นๆ ทั้งหมดจะเป็นไปตามกฎระดับการแชร์เริ่มต้น
| องค์ประกอบข้อมูลที่จะปรับ | การมองเห็น | เกณฑ์ |
|---|---|---|
| เส้นประกอบเส้นทาง | แสดง | ยานพาหนะอยู่ห่างจากจุดแวะพักไม่เกิน 3 จุด |
| เวลาถึงโดยประมาณ | แสดง | ระยะทางขับขี่ที่เหลือน้อยกว่า 5,000 เมตร |
| จำนวนจุดแวะพักที่เหลือ | ไม่แสดง | ยานพาหนะอยู่ห่างจากจุดแวะพักไม่เกิน 3 จุด |
ตัวอย่างต่อไปนี้แสดงการกำหนดค่านี้
"taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"estimatedArrivalTimeVisibility": {
"remainingDrivingDistanceMetersThreshold": 5000
},
"remainingStopCountVisibility": {
"never": true
}
}
กฎระดับการแชร์เส้นประกอบเส้นทางและตำแหน่งของยานพาหนะ
เส้นประกอบเส้นทางจะแสดงไม่ได้หากตำแหน่งของยานพาหนะไม่แสดงด้วย เนื่องจากผู้ใช้จะอนุมานตำแหน่งของยานพาหนะได้จากจุดสิ้นสุดของเส้นประกอบ
หลักเกณฑ์เหล่านี้จะช่วยให้คุณระบุชุดค่าผสมที่ถูกต้องสำหรับตัวเลือกระดับการแชร์เส้นประกอบเส้นทางและตำแหน่งของยานพาหนะ
| ตัวเลือกระดับการมองเห็นเดียวกัน | เกณฑ์การมองเห็น | คำแนะนำ |
|---|---|---|
| ตัวเลือกเส้นประกอบเส้นทางตั้งค่าเป็นแสดงเสมอ | ตั้งค่าตำแหน่งของยานพาหนะเป็นแสดงเสมอ | |
| ตำแหน่งของยานพาหนะตั้งค่าเป็นไม่แสดง | ตั้งค่าเส้นประกอบเส้นทางเป็นไม่แสดง | |
ตัวเลือกการมองเห็นคือตัวเลือกใดตัวเลือกหนึ่งต่อไปนี้
|
ตั้งค่าตัวเลือกเส้นประกอบเส้นทางเป็นค่าที่น้อยกว่าหรือเท่ากับค่าที่ตั้งไว้ สำหรับตำแหน่งของยานพาหนะ เช่น "taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"vehicleLocationVisibility": {
"remainingStopCountThreshold": 5
},
}
|
|
| ตัวเลือกระดับการแชร์ที่แตกต่างกัน | เกณฑ์การมองเห็น | คำแนะนำ |
| ตำแหน่งของยานพาหนะแสดง | กรณีนี้จะเกิดขึ้นเมื่อตรงตามตัวเลือกระดับการแชร์ทั้ง ตำแหน่งของยานพาหนะและ เส้นประกอบ เช่น "taskTrackingViewConfig": {
"routePolylinePointsVisibility": {
"remainingStopCountThreshold": 3
},
"vehicleLocationVisibility": {
"remainingDrivingDistanceMetersThreshold": 3000
},
}ในตัวอย่างนี้ ตำแหน่งของยานพาหนะจะแสดงก็ต่อเมื่อจำนวนจุดแวะพักที่เหลือมีอย่างน้อย 3 จุดและ ระยะทางขับขี่ที่เหลือมีอย่างน้อย 3, 000 เมตร |
ปิดใช้การปรับให้พอดีอัตโนมัติ
คุณสามารถหยุดไม่ให้แผนที่ปรับวิวพอร์ตให้พอดีกับยานพาหนะและเส้นทางที่คาดการณ์ไว้โดยอัตโนมัติได้ด้วยการปิดใช้การปรับให้พอดีอัตโนมัติ ตัวอย่างต่อไปนี้แสดงวิธีปิดใช้การปรับให้พอดีอัตโนมัติเมื่อกำหนดค่ามุมมองแผนที่การแชร์การเดินทาง
JavaScript
const mapView = new
google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
automaticViewportMode:
google.maps.journeySharing
.AutomaticViewportMode.NONE,
...
});
TypeScript
const mapView = new
google.maps.journeySharing.JourneySharingMapView({
element: document.getElementById('map_canvas'),
locationProviders: [locationProvider],
automaticViewportMode:
google.maps.journeySharing
.AutomaticViewportMode.NONE,
...
});