partial update create google map from kmz file
This commit is contained in:
12
app/Http/Controllers/GoogleApisController.php
Normal file
12
app/Http/Controllers/GoogleApisController.php
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Http\Controllers;
|
||||||
|
|
||||||
|
use Illuminate\Http\Request;
|
||||||
|
|
||||||
|
class GoogleApisController extends Controller
|
||||||
|
{
|
||||||
|
public function index(){
|
||||||
|
return view('maps.google-api');
|
||||||
|
}
|
||||||
|
}
|
||||||
46
resources/views/maps/google-api.blade.php
Normal file
46
resources/views/maps/google-api.blade.php
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
@extends('layouts.vertical', ['subtitle' => 'Google Maps'])
|
||||||
|
@section('css')
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
@include('layouts.partials/page-title', ['title' => 'Maps', 'subtitle' => 'Google Maps'])
|
||||||
|
<div id="map" style="width: 100%; height: 500px;"></div>
|
||||||
|
<img src="" />
|
||||||
|
@endsection
|
||||||
|
|
||||||
|
@section('scripts')
|
||||||
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
||||||
|
<script src="https://unpkg.com/togeojson@0.16.0"></script>
|
||||||
|
<script src="https://unpkg.com/leaflet-omnivore@0.3.4/leaflet-omnivore.min.js"></script>
|
||||||
|
<script src="https://unpkg.com/leaflet-kml/L.KML.js"></script>
|
||||||
|
<script>
|
||||||
|
document.addEventListener("DOMContentLoaded", function () {
|
||||||
|
var map = L.map('map').setView([-6.9175, 107.6191], 10); // Jakarta
|
||||||
|
|
||||||
|
// Tambahkan peta dasar dari OpenStreetMap
|
||||||
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||||
|
attribution: '© OpenStreetMap contributors'
|
||||||
|
}).addTo(map);
|
||||||
|
|
||||||
|
// Muat file KMZ
|
||||||
|
omnivore.kml("{{ asset('storage/maps/RENCANAPOLARUANG_RTRW_2024_2044.kmz') }}")
|
||||||
|
.on('ready', function () {
|
||||||
|
try {
|
||||||
|
var bounds = this.getBounds();
|
||||||
|
if (bounds.isValid()) {
|
||||||
|
map.fitBounds(bounds);
|
||||||
|
} else {
|
||||||
|
console.warn("Bounds tidak valid, gunakan fallback.");
|
||||||
|
map.setView([-6.9175, 107.6191], 10); // Default ke Jakarta
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error("Error setting bounds:", error);
|
||||||
|
map.setView([-6.1751, 106.8650], 10);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.addTo(map);
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
@endsection
|
||||||
@@ -4,6 +4,7 @@ use App\Http\Controllers\BusinessOrIndustriesController;
|
|||||||
use App\Http\Controllers\Dashboards\LackOfPotentialController;
|
use App\Http\Controllers\Dashboards\LackOfPotentialController;
|
||||||
use App\Http\Controllers\DataSettingController;
|
use App\Http\Controllers\DataSettingController;
|
||||||
use App\Http\Controllers\Dashboards\BigDataController;
|
use App\Http\Controllers\Dashboards\BigDataController;
|
||||||
|
use App\Http\Controllers\GoogleApisController;
|
||||||
use App\Http\Controllers\Home\HomeController;
|
use App\Http\Controllers\Home\HomeController;
|
||||||
use App\Http\Controllers\Master\UsersController;
|
use App\Http\Controllers\Master\UsersController;
|
||||||
use App\Http\Controllers\MenusController;
|
use App\Http\Controllers\MenusController;
|
||||||
@@ -89,4 +90,8 @@ Route::group(['middleware' => 'auth'], function(){
|
|||||||
// Resource route, kecuali create karena dibuat terpisah
|
// Resource route, kecuali create karena dibuat terpisah
|
||||||
Route::resource('/tourisms-report', ReportTourismController::class);
|
Route::resource('/tourisms-report', ReportTourismController::class);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Route::group(['prefix' => '/maps'], function(){
|
||||||
|
Route::get('/kmz', [GoogleApisController::class, 'index']);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
Reference in New Issue
Block a user