0
나는 구글 맵에 대해 아무것도> _ <을 알 수없고, 나는 내가 전류 소스 (손실이 구글 스프레드 시트 API 계정에 대한 액세스 권한을) 교체해야 this pageGoogle Maps API : 소스를 Google 스프레드 시트 API에서 MySQL/PHP로 바꾸는 방법은 무엇입니까?
의 소스를 업데이트하도록 요청 받았다.
Google지도에 대한 교육이 없습니다. 그러나, 나는 현재의 소스를 대체하기 위해 mysql/php 배열이나 뭔가를 만드는 것이 쉽다는 것을 알 수있다. 그러나, 나는 Google지도를 위해 그것을하는 방법을 모른다.
<? $this->load->view("inc/header");
?>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAALG0LY9VczfCgBGR3gYl-OhSYZ3oXbzqsmNbiZCTxCau3LOQmUxTyi2riEMwN4Qit7X7U2xmd_NND1w"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var cm_map;
var cm_mapMarkers = [];
var cm_mapHTMLS = [];
// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var cm_baseIcon = new GIcon();
cm_baseIcon.shadow = "http://www.google.com/mapfiles/shdow50.png";
cm_baseIcon.iconSize = new GSize(20, 34);
cm_baseIcon.shadowSize = new GSize(37, 34);
cm_baseIcon.iconAnchor = new GPoint(9, 34);
cm_baseIcon.infoWindowAnchor = new GPoint(9, 2);
cm_baseIcon.infoShadowAnchor = new GPoint(18, 25);
// Change these parameters to customize map
var param_wsId = "od6";
var param_ssKey = "t63uNv1JYAjjbdSo2NVr0ew";
var param_useSidebar = true;
var param_titleColumn = "address";
var param_descriptionColumn = "link";
var param_latColumn = "latitude";
var param_lngColumn = "longitude";
var param_rankColumn = "";
var param_iconType = "red";
var param_iconOverType = "green";
/**
* Loads map and calls function to load in worksheet data.
*/
function cm_load() {
if (GBrowserIsCompatible()) {
// create the map
cm_map = new GMap2(document.getElementById("cm_map"));
cm_map.addControl(new GLargeMapControl());
cm_map.addControl(new GMapTypeControl());
cm_map.setCenter(new GLatLng(43.907787,-79.359741), 2);
cm_getJSON();
} else {
alert("Sorry, the Google Maps API is not compatible with this browser");
}
}
/**
* Function called when marker on the map is clicked.
* Opens an info window (bubble) above the marker.
* @param {Number} markerNum Number of marker in global array
*/
function cm_markerClicked(markerNum) {
cm_mapMarkers[markerNum].openInfoWindowHtml(cm_mapHTMLS[markerNum]);
}
/**
* Function that sorts 2 worksheet rows from JSON feed
* based on their rank column. Only called if column is defined.
* @param {rowA} Object Represents row in JSON feed
* @param {rowB} Object Represents row in JSON feed
* @return {Number} Difference between row values
*/
function cm_sortRows(rowA, rowB) {
var rowAValue = parseFloat(rowA["gsx$" + param_rankColumn].$t);
var rowBValue = parseFloat(rowB["gsx$" + param_rankColumn].$t);
return rowAValue - rowBValue;
}
/**
* Called when JSON is loaded. Creates sidebar if param_sideBar is true.
* Sorts rows if param_rankColumn is valid column. Iterates through worksheet rows,
* creating marker and sidebar entries for each row.
* @param {JSON} json Worksheet feed
*/
function cm_loadMapJSON(json) {
var usingRank = false;
if(param_useSidebar == true) {
var sidebarTD = document.createElement("td");
sidebarTD.setAttribute("width","150");
sidebarTD.setAttribute("valign","top");
var sidebarDIV = document.createElement("div");
sidebarDIV.id = "cm_sidebarDIV";
sidebarDIV.style.overflow = "auto";
sidebarDIV.style.height = "860px";
sidebarDIV.style.fontSize = "11px";
sidebarDIV.style.color = "#000000";
sidebarTD.appendChild(sidebarDIV);
document.getElementById("cm_mapTR").appendChild(sidebarTD);
}
var bounds = new GLatLngBounds();
if(json.feed.entry[0]["gsx$" + param_rankColumn]) {
usingRank = true;
json.feed.entry.sort(cm_sortRows);
}
for (var i = 0; i < <?=count($address)+1?>; i++) {
var entry = json.feed.entry[i];
if(entry["gsx$" + param_latColumn]) {
var lat = parseFloat(entry["gsx$" + param_latColumn].$t);
var lng = parseFloat(entry["gsx$" + param_lngColumn].$t);
var point = new GLatLng(lat,lng);
var html = "<div style='font-size:12px'>";
html += "<strong>" + entry["gsx$"+param_titleColumn].$t
+ "</strong>";
var label = entry["gsx$"+param_titleColumn].$t;
var rank = 0;
if(usingRank && entry["gsx$" + param_rankColumn]) {
rank = parseInt(entry["gsx$"+param_rankColumn].$t);
}
var trimmed = label.replace(/^\s+|\s+$/g, '') ;
var link_label = label.replace(/ /gi,'-');
link_label = link_label.toLowerCase();
link_label = link_label.replace(/^\s+|\s+$/g, '') ;
if(trimmed == "1286 West Adams Blvd")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/1286-west-adams-blvd.html\">Click here for housing option</a>" ;
}
}
else if(trimmed == "1239 West 30th Street")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/1352-west-29th-street.html\">Click here for housing option</a>" ;
}
}
else if(trimmed == "2150 Oak Street")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/2126-50-south-oak-867-889-west-23rd-street.html\">Click here for housing option</a>" ;
}
}
else if(trimmed == "1146 West 36th Place")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/1140--1168-west-36th-place.html\">Click here for housing option</a>" ;
}
}else if(trimmed == "1199 West 37th Drive")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/1189--1199-west-37th-drive.html\">Click here for housing option</a>" ;
}
}
else if(trimmed == "2611 South Portland Street")
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/2611-south-portland.html\">Click here for housing option</a>" ;
}
}
else
{
if(entry["gsx$" + param_descriptionColumn]) {
html += "<br/><a href=\"<?=base_url()?>Housing/propertyDetail/"+link_label+".html\">Click here for housing option</a>" ;
}
}
html += "</div>";
// create the marker
var marker = cm_createMarker(point,label,html,rank);
//label = 'hello';
cm_map.addOverlay(marker);
cm_mapMarkers.push(marker);
cm_mapHTMLS.push(html);
bounds.extend(point);
if(param_useSidebar == true) {
var markerA = document.createElement("a");
markerA.setAttribute("href","javascript:cm_markerClicked('" + i +"')");
markerA.style.color = "#000000";
var sidebarText= "";
if(usingRank) {
sidebarText += rank + ") ";
}
sidebarText += label;
markerA.appendChild(document.createTextNode(sidebarText));
// condition to remove an address from the list....
/*if(trimmed != '1155 24th Street')
{*/
sidebarDIV.appendChild(markerA);
sidebarDIV.appendChild(document.createElement("br"));
sidebarDIV.appendChild(document.createElement("br"));
//}
}
}
}
cm_map.setZoom(cm_map.getBoundsZoomLevel(bounds));
cm_map.setCenter(bounds.getCenter());
}
/**
* Creates marker with ranked Icon or blank icon,
* depending if rank is defined. Assigns onclick function.
* @param {GLatLng} point Point to create marker at
* @param {String} title Tooltip title to display for marker
* @param {String} html HTML to display in InfoWindow
* @param {Number} rank Number rank of marker, used in creating icon
* @return {GMarker} Marker created
*/
function cm_createMarker(point, title, html, rank) {
var markerOpts = {};
var nIcon = new GIcon(cm_baseIcon);
if(rank > 0 && rank < 100) {
nIcon.imageOut = "http://gmaps-samples.googlecode.com/svn/trunk/" +
"markers/" + param_iconType + "/marker" + rank + ".png";
nIcon.imageOver = "http://gmaps-samples.googlecode.com/svn/trunk/" +
"markers/" + param_iconOverType + "/marker" + rank + ".png";
nIcon.image = nIcon.imageOut;
} else {
nIcon.imageOut = "http://gmaps-samples.googlecode.com/svn/trunk/" +
"markers/" + param_iconType + "/blank.png";
nIcon.imageOver = "http://gmaps-samples.googlecode.com/svn/trunk/" +
"markers/" + param_iconOverType + "/blank.png";
nIcon.image = nIcon.imageOut;
}
markerOpts.icon = nIcon;
markerOpts.title = title;
var marker = new GMarker(point, markerOpts);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(html);
});
GEvent.addListener(marker, "mouseover", function() {
marker.setImage(marker.getIcon().imageOver);
});
GEvent.addListener(marker, "mouseout", function() {
marker.setImage(marker.getIcon().imageOut);
});
GEvent.addListener(marker, "infowindowopen", function() {
marker.setImage(marker.getIcon().imageOver);
});
GEvent.addListener(marker, "infowindowclose", function() {
marker.setImage(marker.getIcon().imageOut);
});
return marker;
}
/**
* Creates a script tag in the page that loads in the
* JSON feed for the specified key/ID.
* Once loaded, it calls cm_loadMapJSON.
*/
function cm_getJSON() {
// Retrieve the JSON feed.
var script = document.createElement('script');
script.setAttribute('src', 'http://spreadsheets.google.com/feeds/list'
+ '/' + param_ssKey + '/' + param_wsId + '/public/values' +
'?alt=json-in-script&callback=cm_loadMapJSON');
script.setAttribute('id', 'jsonScript');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
setTimeout('cm_load()', 500);
//]]>
</script>
<body onLoad="FP_preloadImgs(/*url*/'button18.jpg', /*url*/'button19.jpg'); if (document.getElementById('zoom_searchbox')) {document.getElementById('zoom_searchbox').focus();}" bgcolor=#969696>
<div id="junaid"></div>
<div class="body_main">
<div class="banner_contianer">
<div class="banner_bg"><img src="<?=base_url()?>banners/properties.png" alt="" /></div>
<div class="banner_btm_flear"></div></div>
<div class="body_left_cont">
<div class="welcome_message">
<h1><?=$page_data['heading']?></h1>
</div>
<div class="tabs_main_cont" >
<div class="tabs_md_show"><img src="<?=base_url()?>images/search-top-bg.png" alt="" /></div>
<div class="tabs_data_cont">
<div class="tabs_repeat_inner">
<div class="show_detail_contianer">
<div class="show_In_cont">
<div class="show_In_properties">
<table bgcolor="#FFFFFF" id="cm_mapTABLE">
<tbody> <tr id="cm_mapTR">
<td> <div id="cm_map" style="width:530px; height:860px"></div> </td>
</tr> </tbody>
</table>
</div>
</div>
</div>
</div>
<div class="tabs_md_show"><img src="<?=base_url()?>images/search-btm-bg.png" alt="" /></div>
</div>
</div>
</div>
</body>
<?PHP
//$this->load->view("inc/right_panel");
?>
<div class="opportunities">We Do Business In Accordance With The Federal Fair Housing Law Equal Housing Opportunity</div>
</div>
<?PHP
$this->load->view("inc/footer");
?>
나는 MySQL은/PHP 배열이있는 경우, 어떻게 내가 배열을 에코 어떻게 소스?
<?php
include('database.php');
while($data = mysql_fetch_array($DATABASE))
{
$map_source['address'] = data['address'];
$map_source['lat'] = data['long'];
$map_source['long'] = data['lat'];
}
mysql_close($con);
?>
을 교체하는 : 여기
는 구글지도의 코드 소스를 대체 하시겠습니까?편집 : 2012년 4월 19일 제공되는 튜토리얼 @의 마노 - 마크 거쳐 , 내가 함께 거의 모든 것을 얻을 수 있었다 4시 반 pm**. 그러나 this test page)은 아무 것도 표시하지 않습니다. 뭘 잘못했는지 알아 내 줄 수있어?
PHP/XML :
<?php
require("database.php");
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','<',$htmlStr);
$xmlStr=str_replace('>','>',$xmlStr);
$xmlStr=str_replace('"','"',$xmlStr);
$xmlStr=str_replace("'",''',$xmlStr);
$xmlStr=str_replace("&",'&',$xmlStr);
return $xmlStr;
}
// Opens a connection to a MySQL server
$connection=mysql_connect ($localhost, $username, $password);
if (!$connection) {
die('Not connected : ' . mysql_error());
}
// Set the active MySQL database
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
die ('Can\'t use db : ' . mysql_error());
}
// Select all the rows in the tbl_address table
$query = "SELECT * FROM tbl_address WHERE 1";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml");
// Start XML file, echo parent node
echo '<markers>';
// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
echo '<marker ';
echo 'name="' . parseToXML($row['g_address']) . '" ';
echo 'address="' . parseToXML($row['g_address']) . '" ';
echo 'lat="' . $row['g_latitude'] . '" ';
echo 'lng="' . $row['g_longitude'] . '" ';
echo 'type="USC Student Housing" ';
echo '/>';
}
// End XML file
echo '</markers>';
?>
HTML MAP :
<!DOCTYPE html >
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>PHP/MySQL & Google Maps Example</title>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
//<![CDATA[
var customIcons = {
restaurant: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png',
shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
},
bar: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png',
shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
}
};
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(47.6145, -122.3418),
zoom: 13,
mapTypeId: 'roadmap'
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("http://firstchoicehousing.com/_api/google/maps/phpsqlajax_genxml2.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[[]i].getAttribute("name");
var address = markers[[]i].getAttribute("address");
var type = markers[[]i].getAttribute("type");
var point = new google.maps.LatLng(
parseFloat(markers[[]i].getAttribute("lat")),
parseFloat(markers[[]i].getAttribute("lng")));
var html = "<b>" + name + "</b> <br/>" + address;
var icon = customIcons[[]type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
bindInfoWindow(marker, map, infoWindow, html);
}
});
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}
//]]>
</script>
</head>
<body onload="load()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>**
그냥 다른 곳에서 데이터를 끌어'cm_getJSON'를 다시 작성 : Google지도 API를 시작하는 PHP/MySQL을 사용 Google지도 API 개발자 사이트에 기사의 몇 가지가있다. 우리는 당신을 위해 코드를 작성하지 않을 것이며, 귀하의 문제는 실제로 Google Maps API와 관련이 거의 없습니다. – ceejayoz
초심자로서, 나는 연석에 있습니다. 이것은 내가 유일하게 신뢰하고 내가 곤경에 처했을 때 나의 고향이 된 한 공동체입니다. 공동체로서 다른 사람들을 돕는 사람들의 선의에 기반합니다. 내가 베테랑이되면 (나는 내가 할 수 있기를 바란다.) 나는 부탁을 돌려주고 내가 할 수있는 한 최대한 도울 것이다 ... – Omar
그래도, 당신은 여전히 스스로해야 할 일이있다. 이것은 "나에게 코드 제공"유형 사이트가 아닙니다. 그것은 "나는 X를 시도하고 특정 문제 Y"사이트를 만났습니다. – ceejayoz