1

サーバーからJavascriptを取得するための次のコードがあります。

        $.ajax({
            url: '<?=base_url()?>index.php/guide/getMap',
            success: function(data) {
                $('.result').text(data);
                alert('Load was performed.');
            }
        });

これにより、必要なコードが正常に返されます。

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
        //<![CDATA[

        var map; // Global declaration of the map
        var iw = new google.maps.InfoWindow(); // Global declaration of the infowindow
        var lat_longs = new Array();
        var markers = new Array();
        function initialize() {

             var myLatlng = new google.maps.LatLng(37.4419, -122.1419);
            var myOptions = {
                zoom: 13,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP}
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);


        }


    function createMarker(markerOptions) {
        var marker = new google.maps.Marker(markerOptions);
        markers.push(marker);
        lat_longs.push(marker.getPosition());
        return marker;
    }

        window.onload = initialize;

        //]]>
</script>

私の質問は、現在成功したコールバックで発生しているアラートの代わりに、この JavaScript を HTML ドキュメントの本文 (または先頭) に配置して、Google マップが表示されるようにするにはどうすればよいですか? (注: 必要な html を返すために別の ajax 呼び出しも行います)。

JS で GMaps API を呼び出すだけでなく、サーバー上で適切なマーカーを取得してマップに配置するなどの処理を行う必要があるためです。サーバー上でこのライブラリを使用しています。マップを表示するために必要な js/html を生成する側。

4

2 に答える 2

0

これを試してみてください。これでうまくいくと思います。ページの下部に次のコードを配置します。 

 $.ajax({
                url: '<?=base_url()?>index.php/guide/getMap',
                success: function(data) {
                    $('.result').text(data);
                    initialize();
                }
            });
于 2012-11-01T03:54:55.817 に答える
0

初期化関数を人里離れた場所に配置する代わりに、次のようなコールバック関数と結び付けます。

$.ajax({
    url: '<?=base_url()?>index.php/guide/getMap',
    success: function(data) {

        function initialize() {
            var myLatlng = new google.maps.LatLng(data.lat, data.lng);
            var mapCanvas = document.getElementById("map_canvas");
            var myOptions = {
                zoom: 13,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP}
                map = new google.maps.Map(mapCanvas, myOptions);
        }
    }
});

もちろん、きれいに見えるように、または好きなようにレイアウトするために、物を移動することができます。重要なことは、マップからデータを取得した後、マップ API が読み込まれた後に、初期化関数を呼び出すことです。

于 2012-11-01T03:54:36.163 に答える