Closes matching address (Google maps) APEX procedure

狂风中的少年 提交于 2019-12-23 05:14:32

问题


I have problem with displaying address in text field in one of the apex pages region. Currently I have longitude and latitude text fields, which read their values from draggable marker from the google map. (When you drag the marker, the program automatically retrieve geocode and it assigns it directly to appropriate text fields, it works perfectly fine). Now I want to do the same for address, when I drag the marker into any position I want to receive the closes matching address, which will go to the text field. The problem is that I do not know how to format and set right function to display this marker in the text field, all I have now is that when I type the address to the text field and I drag the marker the address is being automatically formatted but it is not updating its current position. The way I used to get the geocode into the text fields is by using procedure in the database, which is later called by apex page using PL/SQL and JavaScript. Here is my code so far:

create or replace PROCEDURE SHOW_LOCATION (
    map_div IN VARCHAR2 DEFAULT 'map-canvas',
    issue_street_address IN VARCHAR2,
    issue_post_code IN VARCHAR2,
    city IN VARCHAR2,
    lat_item IN VARCHAR2,
    long_item IN VARCHAR2)
is
    a_mapstr VARCHAR2 (32000);
begin
    a_mapstr := '

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false">  </script>
<script type="text/javascript">
    var map;
    var marker;
function initialize(myAddress, myLat, myLng) {
    var mapOptions = {
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }    
    map = new google.maps.Map(document.getElementById('||''''|| map_div ||''''||'),mapOptions);
    geocoder = new google.maps.Geocoder();
    geocoder.geocode( { '||''''||'address'||''''||': myAddress}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var markerOptions = {
                map: map,
                draggable: true,
                animation: google.maps.Animation.DROP,
                flat: false,
                position: results[0].geometry.location
            }

            map.setCenter(results[0].geometry.location);
            marker = new google.maps.Marker(markerOptions);            
            google.maps.event.addListener(marker, '||''''||'dragstart'||''''||', function() {map.closeInfoWindow();} );
            google.maps.event.addListener(marker, '||''''||'dragend'||''''||', function(event) {
                document.getElementById("'||lat_item||'").value=event.latLng.lat();
                document.getElementById("'||long_item||'").value=event.latLng.lng();
                function(responses) {
                    if (responses && responses.length > 0) {
                        updateMarkerAddress(responses[0].formatted_address);
                    } 
                    else {
                        updateMarkerAddress("Cannot determine address at this location.");
                    }
                };                      
                function updateMarkerAddress() {
                    document.getElementById("'||issue_street_address||'").value = responses[0].formatted_address;
                }      
            })
        } 
        else {
            document.getElementById("'||map_div||'").innerHTML = "No mapdata found for given address. Did you enter a correct address?";
        }     
    });
};     
//google.maps.event.addDomListener(window, ''load'', initialize);
</script>';
--

sys.htp.p (a_mapstr);
EXCEPTION
    WHEN OTHERS
    THEN
        raise_application_error (-20000, 'error in show_map: ' || SQLERRM);
END SHOW_LOCATION;​

来源:https://stackoverflow.com/questions/29988940/closes-matching-address-google-maps-apex-procedure

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!