1

我曾经使用谷歌地图 V2,性能没有问题。在我不得不升级到 V3 之后,我注意到渲染标记对浏览器有相当大的影响,并且经常使它稍微挂起。因为我每 10 秒左右更新一次标记,所以这会产生深远的影响。

有什么我做错了,因为我读过的所有地方都表明 V3 是对速度的改进。甚至地图平移似乎也更慢。

调试到控制台显示更新标记可能需要 120 毫秒秒,即 setPosition()。然而奇怪的是,当我第一次绘制标记时,它几乎是即时的,添加标记只需要 10 毫秒。

这是代码:

function createMarkerWithHandler(device, point, marker_type, dPoint)
{
    bounds_.extend(point);

    var lblclass = "markerLabel";
    var marker_display_text = device.dpt;
    var zIndex = getMarkerZIndex(marker_type);
    var qp = 0;

    lblclass += device.ol==STATUS_NOLOCK ? " m_nl" : " m_ol");

    if(device.qp > 0)
        qp = device.qp;

    var tracker = trackingcache_.getTracker(device.id); 

    if(tracker.isValid()) {
        // update
        tracker.update({
            zIndex: zIndex,
            layer: qp,
            labelClass: lblclass,
            labelStyle: {zIndex: zIndex },
            position: point
        });     
    } else {
        // create the google maps marker
        var marker = new MarkerWithLabel({
               map: layout_.Map,
               icon: customIcons_[marker_type],            
               position: point,
               draggable: false,
               zIndex: zIndex,
               labelContent: marker_display_text,
               labelClass: lblclass, // the CSS class for the label
               labelStyle: { zIndex: zIndex },
               layer: qp
             });

        tracker = trackingcache_.add(device.id, marker);        
    }

    tracker.setEventListener({
        device: device,
        location: dPoint
    });

    lblclass = null;
    marker_display_text = null;
    zIndex = null;
    device = null;
    dPoint = null;

    // add it to our tracking cache
    return tracker;
}

function TrackerObj(deviceid, marker)
{
    this.marker_ = marker;
    this.valid_ = deviceid.length > 0;
    this.id_ = deviceid;
    this.updated_ = this.valid_;
    this.eventListener_ = null;
    this.options_ = null;

    this.unregisterEventListener = function() {
        if(this.eventListener_) {
            google.maps.event.removeListener(this.eventListener_);
            this.eventListener_ = null;
        }
    };

    this.registerEventListener = function() {       
        var me = this;

        if(this.options_) {
            this.addListener(function() {
                closure_getGeoAddress(me.options_.device, this, me.options_.location, me.getLatLng());
            });                 
        }
    };
};

TrackerObj.prototype.update = function(options) {
    var current;
    var labelClass;

    var marker = this.getMarker();
    if(marker) {
        labelClass = marker.get("labelClass");

        if(labelClass !== options.labelClass) {
            marker.label.setLayer(options.layer);
            marker.set("labelClass", options.labelClass);
            marker.setZIndex(options.zIndex);
        }

        current = this.getLatLng();

        if(!current.equals(options.position)) {         
            // NOTE:  This code is taking upto 100ms
            marker.setPosition(options.position);           
        }       
    }

    this.updated_ = true;
};
TrackerObj.prototype.setEventListener = function(options) {
    this.options_ = options;

    if(!this.eventListener_) {          
        this.registerEventListener();
    }           
};
4

1 回答 1

0

对于动画标记,optimized: falseMarkerOptions对象中设置。这将禁用画布标记并恢复为 V2 中基于 DOM 的标记。这已经是可拖动标记的情况。

于 2013-06-12T11:37:20.803 回答