TIF_E41200809/resources/views/admin/pages/desa/map.blade.php

53 lines
1.5 KiB
PHP

@extends('admin.layouts.layout')
@section('title', 'Informasi Peta | Skripsi 2024')
@section('nav', 'Informasi Peta')
@section('content')
<div class="pagetitle">
<nav>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="{{ route('dashboard') }}" class="text-decoration-none text-black">Dashboard</a></li>
<li class="breadcrumb-item">Peta</li>
<li class="breadcrumb-item active">Informasi Peta</li>
</ol>
</nav>
</div>
<div class="container-fluid mb-3">
<div class="card">
<div class="card-body">
<div id="map" style="height: 600px; z-index : 0;"></div>
</div>
</div>
</div>
@endsection
@push('scripts')
<script>
var peta1 = L.tileLayer('http://www.google.cn/maps/vt?lyrs=s@189&gl=cn&x={x}&y={y}&z={z}', {
attribution: 'google'
});
var peta2 = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
});
var map = L.map('map', {
layers: [peta2], // Default layer
}).setView([-7.257221472743715, 112.75834095184003], 14);
var baseLayers = {
"Satelite": peta1,
"Streets": peta2
};
L.control.layers(baseLayers).addTo(map);
@foreach($dusun as $marker)
var marker = L.marker([{{ $marker->latitude }}, {{ $marker->longitude }}]).addTo(map);
marker.bindPopup("<b>Nama Dusun:</b> {{ $marker->nama }}").openPopup();
@endforeach
</script>
@endpush