2

我有一个基于谷歌地图的网站（使用 gmap3），它上面有标记和一个浮动小部件，其中包含有关活动标记的文本。这个浮动小部件占据了大约一半的屏幕。地图会自动居中（或平移到）活动标记。

从上面可以看出，屏幕中心的活动标记非常靠近文本小部件的右侧（几乎覆盖了屏幕的所有左侧）。我想让它更松散——比如说，不是在屏幕的中心，而是从左边大约 2/3 和从右边大约 1/3 （当然是水平的；垂直它应该保持居中）。

换句话说，我想要以下内容：当一个新标记被选择为活动时，地图应该平移到这样的位置，即这个标记距离屏幕右侧大约 1/3 的屏幕宽度。

更改地图中心的纬度无济于事，因为这应该适用于任何缩放级别。我需要类似“panTo (width: 66%; height:50%)”的东西（当然，这不是真正的代码）。

先感谢您。

(       function($){
    var $et_main_map = $( '#et_main_map' );

    et_active_marker = null;

    $et_main_map.gmap3({
        map:{
            options:{
<?php
while ( have_posts() ) : the_post();
$et_location_lat = get_post_meta( get_the_ID(), '_et_listing_lat', true );
$et_location_lng = get_post_meta( get_the_ID(), '_et_listing_lng', true );

            if ( '' != $et_location_lat && '' != $et_location_lng )
                printf( 'center: [%s, %s],', $et_location_lat, $et_location_lng );

break;
endwhile;
rewind_posts();
?>

                            zoom: <?php
                        if ( is_home() || is_front_page() )
                            echo esc_js( et_get_option( 'explorable_homepage_zoom_level', 3 ) );
                        else
                            echo esc_js( et_get_option( 'explorable_default_zoom_level', 5 ) ); ?>,
                mapTypeId: google.maps.MapTypeId.<?php echo esc_js( strtoupper( et_get_option( 'explorable_map_type', 'Roadmap' ) ) ); ?>,
                mapTypeControl: false,
                mapTypeControlOptions: {
                    position : google.maps.ControlPosition.LEFT_CENTER,
                    style : google.maps.MapTypeControlStyle.DROPDOWN_MENU
                },
                streetViewControlOptions: {
                    position: google.maps.ControlPosition.LEFT_CENTER
                },
                navigationControl: true,
                scrollwheel: false,
                streetViewControl: false,
                zoomControl: true,
                                    zoomControlOptions: {
                    position: google.maps.ControlPosition.RIGHT_BOTTOM,
                                            style: google.maps.ZoomControlStyle.SMALL
                },
            }
        }
    });
4

1 回答 1

2

您可以首先将地图以给定的 LatLng 居中，然后用于panBy()应用​​偏移：

 map.panBy(-Math.floor(map.getDiv().offsetWidth/6),0)

对于 gmap3，您可以使用 map-option 的 event-property 来应用它：添加以下代码

        events:{
        idle:function(map){
            google.maps.event.clearListeners(map,'idle');
            map.panBy(-parseInt(this.width()/6),0);
         }
      },

紧接着

$et_main_map.gmap3({
        map:{
于 2013-10-06T17:47:46.983 回答