0

Google マップの生成とページへの表示に問題があります。これが私の見解です。これを適切に機能させるにはどうすればよいですか?

<?php 
    $telephones = $this->telephones;
    $telephonesa = array();
    foreach($telephones as $telephone){
        array_push($telephonesa, $telephone);
    }
?>

<div id="googleMap" style="width:500px;height:380px;"></div>

// client-side
<script>
var object = {};
    object.dist = 100000;
    $(document).ready(function() {
        $( "#getclosest" ).click(function() {
            $.mobile.loading( 'show' );
            getLocation();
        });
    });

    function getLocation()
    {
        if (navigator.geolocation)
        {
            navigator.geolocation.getCurrentPosition(showPosition);
        }
        else{
            alert("Geolocation is not supported by this browser.");
        }
    }

    function showPosition(position)
    {
        var currlat = position.coords.latitude;
        var currlon = position.coords.longitude;

        getClosest(currlat, currlon);
    }

    function getClosest(currlat, currlon){

        var telephones = <?php echo json_encode($telephonesa); ?>;

        var length = telephones.length,
            element = null;
        for (var i = 0; i < length; i++) {
            element = telephones[i];
            object.distance = getDistanceBetweenLatLongs(currlat, currlon, element.Location.Longitude, element.Location.Latitude);

            if (object.distance < object.dist){
                object.dist = object.distance;
                object.index = i;
            }
        }

        showToilet(object.index);
    }

    function showToilet(index){
        var telephones = <?php echo json_encode($telephonesa); ?>;
        var telephone = telephones[index];

        showGooglemaps(telephone.Location.Latitude, telephone.Location.Longitude);
    }

    function showGooglemaps(lat,lon){
        google.maps.visualRefresh = true;
        var myCenter=new google.maps.LatLng(lat,lon);
        var marker;

        function initialize()
        {
            var mapProp = {
                center:myCenter,
                zoom:13,
                mapTypeId:google.maps.MapTypeId.ROADMAP
            };
            var map=new google.maps.Map(document.getElementById("googleMap")
                ,mapProp);


            marker=new google.maps.Marker({
                position:myCenter,
                animation:google.maps.Animation.BOUNCE
            });

            marker.setMap(map);

            google.maps.event.trigger(map, 'load');

        }
        $("#getclosest").hide();
        $.mobile.loading( 'hide' );

        google.maps.event.addDomListener(window, 'load', initialize);
    }

ご覧のとおり、呼び出す関数「ShowGooglemaps」がありますが、出力には何も表示されません...

4

1 に答える 1