نیاز به کسی که به گوگل مپ آشنایی داشته باشه

[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]

با سلام ، میتونید از لینک زیر استفاده کنین و اگه میخواین با API کار کنین و اطلاعاتی را ذخیره و نمایش بدین از قطعه کد های زیر میتونید استفاده کنید .

فایل Index.html

[HTML]
<script type="text/javascript">
function map_show(){

$(document).ready(function() {

var url_site="<?php echo $_SERVER['SERVER_NAME']; ?>";
var url_blue = "http://"+url_site+"/admin/inc/core/icons/pin_blue.png";
var url_green = "http://"+url_site+"/admin/inc/core/icons/pin_green.png";
var url_prosses = "http://"+url_site+"/admin/inc/core/map_process.php";

var mapCenter = new google.maps.LatLng(36.6967596,51.1919975); //Google map Coordinates
var map;

map_initialize(); // initialize google map

//############### Google Map Initialize ##############
function map_initialize()
{
var googleMapOptions =
{
center: mapCenter, // map center
zoom: 10, //zoom level, 0 = earth view to higher value
maxZoom: 28,
minZoom: 3,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL //zoom control size
},
scaleControl: true, // enable scale control
mapTypeId: google.maps.MapTypeId.ROADMAP // google map type
};

map = new google.maps.Map(document.getElementById("google_ma p"), googleMapOptions);

//Load Markers from the XML File, Check (map_process.php)
$.get(url_prosses, function (data) {
$(data).find("marker").each(function () {
var name = '<a style="padding:10px;text-decoration: none;" target="_blank" href="http://'+url_site+'/villa.php?id='+$(this).attr('name')+'" > '+$(this).attr('name')+'</a>';
var address = '<p style="line-height: 25px;font-family: tahoma;font-size: 13px;">'+$(this).attr('address')+"</p>";
var point = new google.maps.LatLng(parseFloat($(this).attr('lat')) ,parseFloat($(this).attr('lng')));
create_marker(point, name, address, false, false, false, url_blue);
});
});

//Right Click to Drop a New Marker
google.maps.event.addListener(map, 'rightclick', function(event) {
//Edit form to be displayed with new marker
var EditForm = '<p><div class="marker-edit">'+
'<form method="POST" name="SaveMarker" id="SaveMarker">'+
'<label for="pName"><input type="text" name="pName" class="save-name" placeholder=" ....." maxlength="40" /></label>'+
'<label for="pAddress"><input type="text" name="pAddress" class="save-address" placeholder="توضیحات (آدرس و ... )" maxlength="40" /></label>'+
'</form>'+
'</div></p><button name="save-marker" class="save-marker">ثبت</button>';

//Drop a new Marker with our Edit Form
create_marker(event.latLng, 'مکان جدید', EditForm, true, true, true, url_green);
});

}

//############### Create Marker Function ##############
function create_marker(MapPos, MapTitle, MapDesc, InfoOpenDefault, DragAble, Removable, iconPath)
{

//new marker
var marker = new google.maps.Marker({
position: MapPos,

map: map,
draggable:DragAble,
animation: google.maps.Animation.DROP,
title:"Hello World!",
icon: iconPath
});

//Content structure of info Window for the Markers
var contentString = $('<div class="marker-info-win">'+
'<div class="marker-inner-win"><span class="info-content">'+

'<h1 class="marker-heading">'+MapTitle+'</h1>'+
MapDesc+
'</span><button name="remove-marker" class="remove-marker" title="Remove Marker">حذف مکان</button><div style="clear:both;"></div>'+
'</div></div>');

//Create an infoWindow
var infowindow = new google.maps.InfoWindow();
//set the content of infoWindow
infowindow.setContent(contentString[0]);

//Find remove button in infoWindow
var removeBtn = contentString.find('button.remove-marker')[0];
var saveBtn = contentString.find('button.save-marker')[0];

//add click listner to remove marker button
google.maps.event.addDomListener(removeBtn, "click", function(event) {
remove_marker(marker);
});

if(typeof saveBtn !== 'undefined') //continue only when save button is present
{
//add click listner to save marker button
google.maps.event.addDomListener(saveBtn, "click", function(event) {
var mReplace = contentString.find('span.info-content'); //html to be replaced after success
var mName = contentString.find('input.save-name')[0].value; //name input field value
var mAddress = contentString.find('input.save-address')[0].value; //address input field value

save_marker(marker, mName, mReplace , mAddress); //call save marker function
});
}

//add click listner to save marker button
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker); // click on marker opens info window
});

if(InfoOpenDefault) //whether info window should be open by default
{
infowindow.open(map,marker);
}
}

//############### Remove Marker Function ##############
function remove_marker(Marker)
{

/* determine whether marker is draggable
new markers are draggable and saved markers are fixed */
if(Marker.getDraggable())
{
Marker.setMap(null); //just remove new marker
}
else
{
//Remove saved marker from DB and map using jQuery Ajax
var mLatLang = Marker.getPosition().toUrlValue(); //get marker position
var myData = {del : 'true', latlang : mLatLang}; //post variables
$.ajax({
type: "POST",
url: url_prosses,
data: myData,
success:function(data){
Marker.setMap(null);
alert(data);
},
error:function (xhr, ajaxOptions, thrownError){
alert(thrownError); //throw any errors
}
});
}

}

//############### Save Marker Function ##############
function save_marker(Marker, mName, replaceWin , MapDesc)
{

//Save new marker using jQuery Ajax
var mLatLang = Marker.getPosition().toUrlValue(); //get marker position
var myData = {name : mName, latlang : mLatLang ,address : MapDesc}; //post variables
console.log(replaceWin);

$.ajax({
type: "POST",
url: url_prosses,
data: myData,
success:function(data){
replaceWin.html(data); //replace info window with new html
Marker.setDraggable(false); //set marker to fixed
Marker.setIcon('http://'+url_site+'/icons/pin_blue.png'); //replace icon
},
error:function (xhr, ajaxOptions, thrownError){
alert(thrownError); //throw any errors
}
});
}

});
}
</script>
<style type="text/css">
h1.heading{padding:0px;margin: 0px 0px 10px 0px;text-align:center;font: 18px Georgia, "Times New Roman", Times, serif;}

/* width and height of google map */
#google_map {width: 90%; height: 500px;margin-top:0px;margin-left:auto;margin-right:auto;}

/* Marker Edit form */
.marker-edit label{display:block;margin-bottom: 5px;}
.marker-edit label span {width: 100px;float: left;}
.marker-edit label input, .marker-edit label select{height: 24px;}
.marker-edit label textarea{height: 60px;}
.marker-edit label input, .marker-edit label select, .marker-edit label textarea {width: 99%;margin:0px;padding-left: 5px;border: 1px solid #DDD;border-radius: 3px;}

/* Marker Info Window */
h1.marker-heading{color: #585858;margin: 0px;padding: 0px;font: 18px "Trebuchet MS", Arial;border-bottom: 1px dotted #D8D8D8;}
div.marker-info-win {text-align:center;max-width: 300px;margin-right: -20px;}
div.marker-info-win p{padding: 0px;margin: 10px 0px 10px 0;}
div.marker-inner-win{padding: 5px;}
button.save-marker, button.remove-marker{cursor: pointer;
font-family: tahoma;
font-size: 12px;
}
</style>
</head>
<body >
<br>
<h1 class="heading">نقشه گوگل</h1>
<br>
<div align="center">برای افزودن مکان روی نقشه راست کلیک کنید </div><br> <br>
<div id="google_map"></div>
<br> <br>
</body>
</html>

[/HTML]

فایل map_process.php

[PHP]
<?php

$mysqli = //اتصال به دیتابیس

header('Content-Type: text/html; charset=UTF-8');
header('Content-language: fa');

################ Save & delete markers #################
if($_POST) //run only if there's a post data
{
//make sure request is comming from Ajax
$xhr = $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
if (!$xhr){
header('HTTP/1.1 500 Error: Request must come from Ajax!');
exit();
}

// get marker position and split it for database
$mLatLang = explode(',',$_POST["latlang"]);
$mLat = filter_var($mLatLang[0], FILTER_VALIDATE_FLOAT);
$mLng = filter_var($mLatLang[1], FILTER_VALIDATE_FLOAT);

//Delete Marker
if(isset($_POST["del"]) && $_POST["del"]==true)
{
$results = $mysqli->query("DELETE FROM markers WHERE lat=$mLat AND lng=$mLng");
if (!$results) {
header('HTTP/1.1 500 Error: Could not delete Markers!');
exit();
}
exit("Done!");
}

$mName = filter_var($_POST["name"], FILTER_SANITIZE_STRING);
$nAddress = filter_var($_POST["address"], FILTER_SANITIZE_STRING);

$results = $mysqli->query("INSERT INTO markers (name, address, lat, lng, type) VALUES ('$mName','$nAddress ',$mLat, $mLng,'')");

if (!$results) {
header('HTTP/1.1 500 Error: Could not Create Markers!');
exit();
}

$output = '<h1 class="marker-heading">'.$mName.'</h1><p>'.$nAddress.'</p>';
exit($output);
}

################ Continue generating Map XML #################

//Create a new DOMDocument object
$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers"); //Create new element node
$parnode = $dom->appendChild($node); //make the node show up

// Select all the rows in the markers table
$results = $mysqli->query("SELECT * FROM markers WHERE 1");
if (!$results) {
header('HTTP/1.1 500 Error: Could not get markers!');
exit();
}

//set document header to text/xml
header("Content-type: text/xml");

// Iterate through the rows, adding XML nodes for each
while($obj = $results->fetch_object())
{
$node = $dom->createElement("marker");
$newnode = $parnode->appendChild($node);
$newnode->setAttribute("name",$obj->name);
$newnode->setAttribute("address",$obj->address);
$newnode->setAttribute("lat", $obj->lat);
$newnode->setAttribute("lng", $obj->lng);
}

echo $dom->saveXML();

[/PHP]

با تشکر

[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]