ColdFusion에서 Google 지도 사용
https://stackoverflow.com/questions/80278
-
09-06-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian문제
테두리 유형 cflayoutarea 컨테이너인 ColdFusion 템플릿에서 Google Maps API를 사용하려고 합니다.그러나 지도는 단순히 표시되지 않습니다.
<cfif isdefined("url.lat")>
<cfset lat="#url.lat#">
<cfset lng="#url.lng#">
</cfif>
<head>
<script src= "http://maps.google.com/maps?file=api&v=2&key=xxxx" type="text/javascript">
function getMap(lat,lng){
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
var pt= new GLatLng(lat,lng);
map.setCenter(pt, 18,G_HYBRID_MAP);
map.addOverlay(new GMarker(pt));
}
}
</script>
</head>
<cfoutput>
<body onLoad="getMap(#lat#,#lng#)" onUnload="GUnload()">
Map:<br>
<div id="map_canvas" style="width: 500px; height: 300px"/>
</body>
</cfoutput>"
여기서 lat 및 lng는 Degree.decimal 형식의 좌표입니다.GBrowserIsCompatible()이 어떻게든 TRUE를 반환하지 않아 추가 조치가 취해지지 않는 줄을 추적했습니다.
별도로 열면 템플릿이 완벽하게 작동하지만 cflayoutarea 컨테이너로 열 때는 그렇지 않습니다.누구든지 이것에 경험이 있습니까?어떤 제안이라도 대단히 감사하겠습니다.
로렌스
CF 8.01, Dreamweaver 8 사용
귀하의 제안을 시도했지만 여전히 작동하지 않습니다.지도는 호출 코드가 인라인일 때만 표시됩니다.그러나 이 컨테이너 페이지가 또 다른 div에서 호출되면 지도가 다시 사라집니다.
이 문제는 cflayout 컨테이너와 관련된 것으로 생각됩니다.해결책에 대한 단서가 있는지 알아보기 위해 Extjs 문서를 찾아보겠습니다.
해결책
성공!(일종의...)
마침내 작동하게 되었지만 Adam이 제안한 방식은 아닙니다.
<script src= "http://maps.google.com/maps?file=api&v=2&key=xxxx" type="text/javascript"></script>
<script type="text/javascript">
getMap=function(lat,lng){
if (GBrowserIsCompatible()){
var map = new GMap2(document.getElementById("map_canvas"));
var pt = new GLatLng(lat,lng);
map.setCenter(pt, 18,G_HYBRID_MAP);
map.addOverlay(new GMarker(pt));
}
}
</script>
<cflayout name="testlayout" type="border">
<cflayoutarea name="left" position="left" size="250"/>
<cflayoutarea name="center" position="center">
<!--- sample hard-coded co-ordinates --->
<body onLoad="getMap(22.280161,114.185096)">
Map:<br />
<div id="map_canvas" style="width:500px; height: 300px"/>
</body>
</cflayoutarea>
<!--- <cflayoutarea name="center" position="center" source="map_content.cfm?lat=22.280161&lng=114.185096"/> --->
</cflayout>
모든 것이 동일한 파일에 포함되어야 합니다. 그렇지 않으면 작동하지 않습니다.내 의심은 getElementByID 함수가 자체 파일 외부에 있는 요소를 참조할 수 없다는 것입니다.div가 다른 파일에 있으면(Adam의 예에서처럼) 정의되지 않은 지도가 생성됩니다. 즉, 지도 객체가 생성되지만 그 안에는 아무것도 없습니다.
그래서 저는 이 질문이 이제 다른 수준으로 높아졌다고 생각합니다.Ajax 컨테이너 내부에 있는 요소를 어떻게 참조합니까?
다른 팁
그래서 저는 이 질문이 이제 다른 수준으로 높아졌다고 생각합니다.Ajax 컨테이너 내부에 있는 요소를 어떻게 참조합니까?
AJAX를 통해 로드된 요소를 참조할 수 있어야 합니다. 요소가 화면에 표시될 때까지는(페이지 로드 시에는 아님)getMap()이 모든 것을 트리거하는 것처럼 보입니다.(맞나요?)
이 시도:지도 탭의 인라인 콘텐츠로 가지고 있는 콘텐츠를 정확히 가져와서 map_content.cfm의 콘텐츠로 만듭니다. 그 다음에 이벤트를 실행하기 위해 body onload를 사용하는 대신 div가 정의된 후 인라인으로 작성하세요.
<body>
Map:<br />
<div id="map_canvas" style="width:500px; height: 300px"/>
<script type="text/javascript">
getMap(22.280161,114.185096);
</script>
</body>
레이아웃 영역에 권한이 없을 수도 있습니다. 스타일.내 생각에는 map_canvas에
position: absolute
또는
position: relative
그것은 단지 직감일 뿐입니다.
CFLayoutArea는 ColdFusion 버전 8에 추가된 새로운 AJAX 태그입니다.(CFWindow, CFDiv 등과 같은 태그 외에)
이러한 새 태그의 AJAX 로드 콘텐츠 내에는 포함 페이지의 외부 JavaScript가 포함되어야 합니다.귀하의 경우에는 <cplayout> 태그가 포함된 페이지가 됩니다.
다음과 같이 시도해 보십시오:
index.cfm(또는 포함된 파일이 무엇이든):
<script src="http://maps.google.com/maps?file=api&v=2&key=xxxx" type="text/javascript">
function getMap(lat,lng){
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
var pt= new GLatLng(lat,lng);
map.setCenter(pt, 18,G_HYBRID_MAP);
map.addOverlay(new GMarker(pt));
}
}
</script>
<cflayout>...</cflayout>
map.cfm(지도 CFLayout 탭의 콘텐츠):
<cfif structKeyExists(url, "lat")>
<cfset variables.lat = url.lat />
<cfset variables.lng = url.lng />
</cfif>
<head></head>
<cfoutput>
<body onLoad="getMap(#variables.lat#,#variables.lng#)" onUnload="GUnload()">
Map:<br>
<div id="map_canvas" style="width: 500px; height: 300px"/>
</body>
</cfoutput>
