谷歌地图 v2 到 v3 代码

Google map v2 to v3 code

本文关键字:代码 v3 v2 谷歌地图      更新时间:2023-09-26

我正在做一个从谷歌地图V2到V3的迁移项目,并编写了下面的代码,但是出现错误,无法解决问题。

我是否使用了错误的谷歌地图方法?

这段代码有什么问题?

<div id="map_canvas" style="width: 300px; height: 225px; font-family:arial; font-size:10px;"></div>
<?php
$map = getMap();
echo $map = str_replace('$_ADDRESS', 'MYADDRESS', $map );

function getMap()
{
    $mapKey = 'MYKEY';
    $_script = '
        <script type="text/javascript" src="//maps.googleapis.com/maps/api/js?key='. $mapKey .'&sensor=false"></script>
        <script type="text/javascript">
            //<![CDATA[
            var map = null;
            var geocoder = null;
            // call initialize function
            initialize( $_ADDRESS );
            // initialize map
            function initialize() 
            {
                var map = new google.maps.Map(document.getElementById("map_canvas"), {
                center: new google.maps.LatLng(37.4419, -122.1419),
                zoom: 13,
                mapTypeId: google.maps.MapTypeId.ROADMAP
                });             
                geocoder = new google.maps.Geocoder();
                // call show Address
                showAddress( address );
            }
            // show address
            function showAddress(address)
            {
                if (geocoder)
                {
                    geocoder.getPosition( address, function(point)
                    {
                        if (!point)
                        {
                            alert(address + " not found");
                        }
                        else
                        {
                            map.setCenter(point, 13);
                            var marker = new google.maps.Marker(point);
                            map.addOverlay(marker);
                            //marker.openInfoWindowHtml(address);
                        }
                    });
                }
            }
            //]]>
    </script>';
    return $_script;
}
?>

有伊德萨吗?谢谢

我把这些答案拆分为第一个处理javascript的基础知识,然后处理使用Google Maps API。

由于我从未使用过地图 API,所以我无法对 V2 发表评论,但看看你在 V3 中的工作方式,我认为这符合您的需求......

<div id="map_canvas" style="width: 300px; height: 225px; font-family:arial; font-size:10px;"></div>
<?php
$map = getMap();
echo $map = str_replace('$_ADDRESS', 'MYADDRESS', $map );

function getMap()
{
    $mapKey = 'MYKEY';
    $_script = '
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places"></script>
        <script type="text/javascript">
            //<![CDATA[
            var map = null;
            var geocoder = null;
            // call initialize function
            initialize( "$_ADDRESS" );
            // initialize map
            function initialize( address ) 
            {
                map = new google.maps.Map(document.getElementById("map_canvas"), {
                center: new google.maps.LatLng(37.4419, -122.1419),
                zoom: 13,
                mapTypeId: google.maps.MapTypeId.ROADMAP
                });             
                geocoder = new google.maps.Geocoder();
                // call show Address
                showAddress( address );
            }
            // show address
            function showAddress(address)
            {
                if (geocoder)
                {
                    geocoder.geocode( { "address": address }, function( results, status )
                    {
                        if ( status == google.maps.GeocoderStatus.OK )
                        {
                            position = results[0].geometry.location;
                            map.setCenter(position, 13);
                            var marker = new google.maps.Marker({ map: map, position: position });
                        }
                        else
                        {
                            alert(address + " not found");
                        }
                    });
                }
            }
            //]]>
    </script>';
    return $_script;
}
?>

话虽如此,我会直接质疑 javascript 中的str_replace - 你能相信这些数据的来源吗? 如果没有,那么你应该在将字符串放入你的javascript之前查找如何清理该字符串,或者你可以允许人们将代码注入你的网站。

看看你遇到的基本JavaScript问题...

尝试在要替换到 javascript 中的字符串周围添加引号

echo $map = str_replace('$_ADDRESS', 'MYADDRESS', $map );

成为:

echo $map = str_replace('$_ADDRESS', "'MYADDRESS'", $map );

这样,包含 javascript 中地址的字符串就被正确引用了。

另外,请确保您可以在初始化函数中接收地址:

function initialize() 

成为:

function initialize( address ) 
最后,当你

在"initialize"中给它赋值时,不要重新声明"map",否则你引用的是一个只存在于该函数中的不同变量:

var map = new google.maps.Map(document.getElementById("map_canvas"), {

成为:

map = new google.maps.Map(document.getElementById("map_canvas"), {