-1

私は部分的な見方をしています。この部分的なビューは、Ajax.actionlink リクエストによって返されます。部分図には Google マップが含まれています。ただし、マップをレンダリングしないスクリプトは、ドキュメントの準備が整ったときに実行する必要があります。

部分ビューの結果に Google マップを表示する方法は?

部分ビュー スクリプト :

 var markers = [];
        markercount = 0;
        var zoom = 7;
        var G = google.maps;
        var map;


     function initializeMap() {

                var centerPoint = new G.LatLng(45.5, -100.5);
                var myOptions = {
                    center: centerPoint,
                    zoom: zoom,
                    mapTypeId: G.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(document.getElementById('map-canvas'),
                    myOptions);

                addPolygon(map);


                var infowindow = new google.maps.InfoWindow();
                var marker = new google.maps.Marker({
                    map: map,
                    anchorPoint: new google.maps.Point(0, -29)
                });


                var input = (
                   document.getElementById('autocomplate'));

                map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

                var autocomplete = new google.maps.places.Autocomplete(input);
                autocomplete.bindTo('bounds', map);




                google.maps.event.addListener(map, 'click', addMarker);


                google.maps.event.addListener(autocomplete, 'place_changed', function () {
                    infowindow.close();
                    marker.setVisible(false);
                    var place = autocomplete.getPlace();
                    if (!place.geometry) {
                        return;
                    }


                    if (place.geometry.viewport) {
                        map.fitBounds(place.geometry.viewport);
                    } else {
                        map.setCenter(place.geometry.location);
                        map.setZoom(17);
                    }
                    marker.setIcon(({
                        url: place.icon,
                        size: new google.maps.Size(71, 71),
                        origin: new google.maps.Point(0, 0),
                        anchor: new google.maps.Point(17, 34),
                        scaledSize: new google.maps.Size(35, 35)
                    }));
                    marker.setPosition(place.geometry.location);
                    marker.setVisible(true);

                    var address = '';
                    if (place.address_components) {
                        address = [
                          (place.address_components[0] && place.address_components[0].short_name || ''),
                          (place.address_components[1] && place.address_components[1].short_name || ''),
                          (place.address_components[2] && place.address_components[2].short_name || '')
                        ].join(' ');
                    }

                    infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address);
                    infowindow.open(map, marker);
                });






            }


            google.maps.event.addDomListener(window, 'load', initializeMap);
4

1 に答える 1