เพิ่ม ScribbleMaps ลงในแอปของคุณ
หมายเหตุ:ใช้ ScribbleMaps Connect Picker เมื่อคุณต้องการให้ผู้ใช้ลงชื่อเข้าใช้ Scribble Maps เรียกดูแผนที่ที่มี และส่งข้อมูลแผนที่กลับไปยังเว็บแอปพลิเคชันของคุณโดยตรงตัวเลือกจะเปิดในป๊อปอัปและจัดการกระบวนการลงชื่อเข้าใช้ของผู้ใช้ที่นั่น ดังนั้นแอปพลิเคชันของคุณไม่จำเป็นต้องเก็บข้อมูลประจำตัว Scribble Maps โดยตรง
สารบัญ
รับ Client ID ของคุณ
เพิ่ม SDK ลงในหน้าเว็บของคุณ
เปิด Connect Picker
จัดการข้อมูลแผนที่ที่เลือก
การกำหนดค่าเพิ่มเติม
รูปแบบที่รองรับและฟิลด์ที่ส่งกลับ
Connect Picker ทำงานอย่างไร
ScribbleMaps Connect Picker ช่วยให้ผู้ใช้ของคุณเรียกดู ค้นหา และเลือกแผนที่จาก Scribble Maps จากนั้นส่งข้อมูลแผนที่นั้นกลับไปยังแอปพลิเคชันของคุณโดยตรงในรูปแบบที่คุณเลือก
วิธีนี้มีประโยชน์เมื่อคุณต้องการให้ผู้ใช้สร้างหรือจัดการข้อมูลภูมิสารสนเทศใน Scribble Maps แล้วโหลดข้อมูลนั้นเข้าสู่แอปของคุณเอง โดยไม่ต้องสร้างตัวเรียกดูแผนที่หรือขั้นตอนการลงชื่อเข้าใช้ขึ้นเอง
กรณีการใช้งาน / ตัวอย่าง:
การผสานรวมนี้มีประโยชน์สำหรับแดชบอร์ด เครื่องมือด้านอสังหาริมทรัพย์ แอปพลิเคชันข้อมูลภาคสนาม และเว็บแอปอื่นๆ ที่ต้องการให้ผู้ใช้เลือกและโหลดข้อมูลแผนที่จาก Scribble Maps
รับ Client ID ของคุณ
-
เปิดเว็บไซต์นักพัฒนาของ Scribble Maps:
https://developers.scribblemaps.com -
ลงทะเบียนโปรเจกต์ฟรี
-
คัดลอก Client ID ของคุณ
คุณจะใช้ค่านี้เมื่อเรียกใช้ Connect Picker
เพิ่ม SDK ลงในหน้าเว็บของคุณ
-
ในหน้าเว็บของคุณ ให้เพิ่ม Connect Picker SDK:
<script src="https://api.scribblemaps.com/connect/picker.js"></script>
-
บันทึกการเปลี่ยนแปลงของหน้าเว็บของคุณ
ตอนนี้แอปพลิเคชันของคุณสามารถใช้ Scribble Maps Connect Picker ได้แล้ว
เปิด Connect Picker
-
เรียก ScribbleMapsConnect.pick() จากหน้าเว็บของคุณ
-
ส่ง clientId ของคุณ format การส่งออกที่คุณต้องการ และคอลแบ็ก onSelect
-
ใช้โค้ดที่คล้ายกับตัวอย่างต่อไปนี้:
ScribbleMapsConnect.pick({ clientId: 'YOUR_CLIENT_ID', format: 'geojson', onSelect: function (result) { // result.data contains your GeoJSON // result.title, result.mapCode, result.thumbUrl also available loadIntoMyApp(result.data); } });เมื่อตัวเลือกเปิดขึ้น ผู้ใช้สามารถยืนยันตัวตน เรียกดูแผนที่ที่มี และเลือกแผนที่ได้
จัดการข้อมูลแผนที่ที่เลือก
-
ในคอลแบ็ก onSelect ให้เข้าถึง result.data
ซึ่งมีข้อมูลแผนที่ในรูปแบบที่คุณร้องขอ -
(ไม่บังคับ) ใช้ฟิลด์เพิ่มเติมที่ส่งกลับมา:
- result.title — ชื่อแผนที่
- result.mapCode — รหัสแผนที่ของ Scribble Maps
- result.thumbUrl — URL ภาพขนาดย่อของแผนที่
-
ส่งข้อมูลเข้าสู่ตรรกะของแอปพลิเคชันของคุณ
ตัวอย่างเช่น โหลด GeoJSON ที่ส่งกลับมาเข้าสู่ตัวแสดงแผนที่หรือเวิร์กโฟลว์ข้อมูลของคุณเอง
การกำหนดค่าเพิ่มเติม
คุณสามารถกำหนดค่าตัวเลือกให้เหมาะกับเวิร์กโฟลว์ของแอปพลิเคชันของคุณมากขึ้น
-
เลือกรูปแบบการส่งออกโดยเปลี่ยนค่า format
ตัวอย่างเช่น: geojson, kml, csv, gpx, dxf, shapefile หรือ smjson -
เลือกแหล่งแผนที่ที่ผู้ใช้สามารถเรียกดูได้ด้วยตัวเลือก tabs
ผู้ใช้สามารถเรียกดูแผนที่จากคลังส่วนตัว แผนที่ที่แชร์ในทีม หรือคอลเลกชันของชุมชน - (ไม่บังคับ) ใช้สไตล์ปุ่มที่ให้มาเพื่อให้เข้ากับอินเทอร์เฟซสว่างหรือมืด
รูปแบบที่รองรับและฟิลด์ที่ส่งกลับ
รูปแบบการส่งออกที่รองรับ:
- GeoJSON
- KML
- CSV
- GPX
- DXF
- Shapefile
- SMJSON
ฟิลด์ผลลัพธ์ที่ส่งกลับ:
- data
- title
- mapCode
- thumbUrl
เมื่อกำหนดค่าแล้ว Connect Picker จะให้ผู้ใช้ของคุณเข้าถึงข้อมูล Scribble Maps ของพวกเขาได้โดยตรงจากภายในแอปพลิเคชันของคุณผ่านจุดผสานรวมเพียงจุดเดียว
ที่เกี่ยวข้อง
นำเข้า/ส่งออกไฟล์และข้อมูล - GeoJSON, รูปภาพ, PDF, CSV, KML, GXP, SHP, DXF, SMJSON, SMT, WKT ฯลฯ
อัปเดตล่าสุด