@capgo/capacitor-native-map

iOS (Apple MapKit)	Android (Google Maps)

code TypeScript yang sama berjalan di kedua platform. Rekaman ini berasal dari aplikasi contohdemo tour, yang dijalankan pada simulator iOS dan emulator Android asli. code untuk setiap langkah ada di Demo README.

Ikhtisar

@capgo/capacitor-native-map memberi Anda satu API TypeScript untuk performa peta native di mobile dan Google Maps JS di web. Buat peta yang di-embed dalam container DOM, atau gunakan mode background (toBack) untuk menggambar peta di belakang WebView transparan dan membangun UI berbranding dalam HTML.

Dukungan platform

Platform	Dukungan	Catatan
iOS	Ya	MapKit
Android	Ya	Google Maps
Web	Ya	Google Maps JS

Kemampuan Utama

• Lifecycle: create, destroy, show, hide, updateLayout, sinkronisasi resize dengan Ionic scroll views.
• Mode background: toBack compositing dengan multi-touch passthrough pada HTML transparan.
• Kamera: setCamera, fitBounds, getMapBounds, min/max zoom, bearing, dan tilt.
• Marker: tambah, perbarui, hapus, seret, clustering, dan event listeners.
• Overlays: polygon, polyline, lingkaran, dan tile overlays (tergantung platform).
• Event: callback untuk map, marker, shape, cluster, dan idle/move kamera.

API Publik

Metode	Deskripsi
create	Buat map (CreateMapArgs: id, config, opsional element, apiKey, toBack, forceCreate).
destroy	Hancurkan instance map dan lepaskan sumber daya native.
show / hide	Tampilkan atau sembunyikan peta native tanpa menghancurkannya.
updateLayout	Perbarui posisi dan ukuran dalam piksel CSS (terutama di toBack mode).
enableTouch / disableTouch	Aktifkan atau matikan gesture pada peta.
setCamera	Pindahkan atau animasikan kamera peta.
getMapType / setMapType	Baca atau atur tipe peta (Normal, Hybrid, Satellite, Terrain, None).
fitBounds	Sesuaikan viewport ke batas latitude dan longitude dengan padding opsional.
getMapBounds	Baca bounds yang terlihat saat ini.
setPadding	Atur padding pada area peta yang terlihat.
addMarker / addMarkers	Tambah satu atau banyak marker; mengembalikan id marker.
removeMarker / removeMarkers	Hapus marker berdasarkan id.
addPolygons / removePolygons	Tambah atau hapus overlay polygon.
addPolylines / removePolylines	Tambah atau hapus polylines.
addCircles / removeCircles	Tambah atau hapus lingkaran.
addTileOverlay / removeTileOverlay	Custom tile layers (Android dan web; iOS menolak dengan UNAVAILABLE).
enableClustering / disableClustering	Marker clustering dengan ukuran cluster minimum opsional.
enableCurrentLocation	Tampilkan titik lokasi pengguna jika izin memungkinkan.
enableIndoorMaps / enableTrafficLayer	Aktifkan/nonaktifkan peta indoor dan lalu lintas (tergantung platform).
setOnMapClickListener	Dengarkan tap pada permukaan peta.
setOnMarkerClickListener	Dengarkan tap pada marker.
setOnCameraIdleListener / setOnCameraMoveStartedListener	Event pergerakan kamera.
setOnClusterClickListener	Event tap cluster.
setOnPolygonClickListener / setOnCircleClickListener / setOnPolylineClickListener	Event tap shape.
setOnMarkerDragStartListener / setOnMarkerDragListener / setOnMarkerDragEndListener	Event drag marker.

Sumber Kebenaran

Referensi API ini dihasilkan dari plugin src/definitions.ts di dalam capacitor-native-map repository.

Lanjutkan dari @capgo/capacitor-native-map

Jika Anda menggunakan @capgo/capacitor-native-map di aplikasi Capacitor Anda, hubungkan dengan Menggunakan @capgo/capacitor-native-map untuk tutorial SEO dan dokumentasi plugin Capgo terkait.