Использование Google Maps в ColdFusion - PullRequest
Новая
       23

Использование Google Maps в ColdFusion

1 голос
/ 17 сентября 2008

Я пытаюсь использовать Google Maps API в шаблоне ColdFusion, который является контейнером типа cflayoutarea. Однако карта просто не отображается: 

<cfif isdefined("url.lat")>
    <cfset lat="#url.lat#">
    <cfset lng="#url.lng#">
</cfif>    
<head>
<script src=                        "http://maps.google.com/maps?file=api&amp;v=2&amp;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 - координаты в градусном и десятичном формате. Я проследил до строки, где GBrowserIsCompatible () почему-то никогда не возвращает TRUE и, следовательно, никаких дальнейших действий не предпринималось.

Если открыть отдельно, шаблон работает отлично, но только не при открытии в виде контейнера cflayoutarea. У кого-нибудь есть опыт в этом? Любые предложения приветствуются.

Lawrence

Использование CF 8.01, Dreamweaver 8

Попробовал ваше предложение, но все еще не работает; карта показывает только когда код вызова встроен. Однако, если эта страница контейнера была вызвана из другого div, карта снова исчезает.

Я подозреваю, что эта проблема связана с контейнером cflayout; Я посмотрю документацию Extjs, чтобы выяснить, есть ли какие-либо выводы к решению.

Ответы [ 4 ]

1 голос
/ 19 сентября 2008

Так что я думаю, что этот вопрос теперь поднят на другой уровень: как вы ссылаетесь на элемент, который находится внутри контейнера 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>
1 голос
/ 19 сентября 2008

Успех! (вроде ...)

Наконец-то все заработало, но не так, как предложил Адам: 

<script src= "http://maps.google.com/maps?file=api&amp;v=2&amp;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 находится в другом файле (как в примере Адама), это приводит к неопределенной карте, то есть объект карты создается, но в нем ничего нет.

Так что я думаю, что этот вопрос теперь поднят на другой уровень: как вы ссылаетесь на элемент, который находится внутри контейнера ajax?

0 голосов
/ 17 сентября 2008

CFLayoutArea - это новый тег AJAX, добавленный в ColdFusion версии 8. (В дополнение к тегам типа CFWindow, CFDiv и т.

В содержимое любого из этих новых тегов, загруженного AJAX, должен быть включен внешний JavaScript-код со страницы, содержащей его. В вашем случае это будет страница с тегом .

Попробуйте что-то вроде этого:

в index.cfm (или в любом другом файле): 

<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;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>
0 голосов
/ 17 сентября 2008

Возможно, область макета не имеет правильного стиля . Я думаю, что вам, возможно, придется дать map_canvas 

position: absolute

или 

position: relative

Это просто догадка.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...