Question

Google Javascript Maps API 3.5

基本问题是，如果您在俯视图中有一个标记位于固定地标上方，如消防栓，则切换到45度视图，标记不再显示在消防栓顶部。反之亦然（将标记置于45度视图中，然后切换到头顶）。

重现：

请在此处查看示例：www.zingjet.com/maptest.html

创建一个带有可拖动标记的基本Google地图网页。在具有45度图像的区域上具有初始标记/地图位置:(尝试：33.501472920248354，-82.01948559679795）。我不确定它是否会针对所有区域显示此问题，因此请尝试开始。

- 确保您在最大和卫星视图附近放大

- 关闭45度图像

- 固定点上的位置标记（人行道角落，房屋烟囱，等）

- 改变到45度视角。

- 标记位置移位

- 尝试旋转45度，看看标记如何相对移动原始点在图像上。

- 切换回头顶，标记位于原始位置。

为什么会出现问题：不知道该相信什么。什么视图显示该标记的准确位置？无法创建允许人们在一个视图中定位标记并在另一个视图中查看标记的网页。主要不一致。

Answer 1

更新2

演示： http://bit.ly/IhpeBu

        var map, marker, overlay, latlng, zoom = 20;
        function initialize() {
            latlng = new google.maps.LatLng(33.501472920248354, -82.01948559679795);
            var myOptions = {
                zoom : zoom,
                center : latlng,
                tilt : 0,
                mapTypeId : google.maps.MapTypeId.SATELLITE
            }
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
            overlay = new google.maps.OverlayView();
            overlay.draw = function() {
            };
            overlay.onRemove = function() {
            };
            overlay.setMap(map);
            marker = new google.maps.Marker({
                position : latlng,
                map : map,
                draggable : true,
                title : "Hello World!"
            });

            google.maps.event.addListener(map, 'zoom_changed', function() {
                zoom = map.getZoom();
            });

            google.maps.event.addListener(map, 'dragend', function() {
                overlay.setMap(map);
            });

            google.maps.event.addListener(marker, 'dragend', function(evt) {
                var tilt = map.getTilt();
                latlng = new google.maps.LatLng(evt.latLng.lat(), evt.latLng.lng());
                if(tilt === 45) {
                    var projection = overlay.getProjection();
                    var latlng2pixel = projection.fromLatLngToContainerPixel(marker.getPosition());

                    var delta = 0;
                    switch(zoom) {
                        case 20:
                            delta = 45;
                            break;
                        case 19:
                            delta = 12;
                            break;
                        case 18:
                            delta = 4;
                            break;
                    }
                    latlng = projection.fromContainerPixelToLatLng(new google.maps.Point(latlng2pixel.x, (latlng2pixel.y + delta )));
                }
            });

            google.maps.event.addListener(map, 'tilt_changed', function() {
                var tilt = map.getTilt();
                if(tilt === 45) {
                    var delta = 0;
                    switch(zoom) {
                        case 20:
                            delta = 65;
                            break;
                        case 19:
                            delta = 32;
                            break;
                        case 18:
                            delta = 16;
                            break;
                    }
                    var projection = overlay.getProjection();
                    var latlng2pixel = projection.fromLatLngToContainerPixel(marker.getPosition());
                    var pixel2latlng = projection.fromContainerPixelToLatLng(new google.maps.Point(latlng2pixel.x, (latlng2pixel.y - delta )));
                    marker.setPosition(pixel2latlng);
                } else {
                    marker.setPosition(latlng);
                }
            });
        }

备注：上面的代码如下：

应用自定义叠加层以使用; google.maps.MapCanvasProjection object ^doc

找到标记的像素位置;

添加到y（顶部= lng）45度（缩放20处为45像素）加上标记图标高度的20像素（x保持不变，因为度数变化很简单视错觉;））;

将这些像素位置转换为有效的latlng位置;

观察tilt方法从0更改为45并反之亦然，并通过设置新坐标来采取相应行动。

Answer 2

你将要做的就是破解它。就谷歌而言，可能没有任何错误，地图上出现了重点＆＃34;＆＃34;在不同的地方因为45度视图改变了地图上的视角，因此离散的lat长度将如何物理地出现在地图上（当缩放变化时会发生类似的事情）。你需要做的是弄清楚视图之间的delta是什么，然后挂钩＆＃34; tilt_changed＆＃34;事件并适当调整您的标记。学习三角洲的一个简单方法就是勾选＆＃34; dblclick＆＃34;事件提醒您鼠标所在的位置：

google.maps.event.addDomListener(map, 'dblclick', function(MouseEvent){
        alert(MouseEvent.latLng.lat()+" "+MouseEvent.latLng.lng());
    }); 
// make sure you disable the maps default zoom on double click 
//or choose a different event or it will get annoying :)

然后点击屏幕标记＆＃34;应该是＆＃34;并创建一个相应调整标记的功能。从理论上讲，您可以定义一个适用于任何角度的函数，这样您所要做的就是通过tilt_changed上的函数传递每个标记的位置。让我知道这对你来说是一个好的开始：）

地图错误：切换视角时标记会在整个地方移动。固定？

2 个答案: