TRUNGTQ

Think Big, Act Small, Fail Fast and Learn Rapidly

NAVIGATION - SEARCH

Đăng ký sự kiện click tới nhiều polygon trong google maps

Hôm nay gặp trường hợp phải đăng ký sự kiện click tới nhiều polygon trong google maps (mảng Polygon)
Mình dùng như này, tuy nhiên nó chỉ ăn 1 polygon đầu tiên, còn các polygon còn lại thì lại không ăn.
Code:
// Vẽ đường bao chiều về
        if ($this.polygonBack == null) {
            $this.polygonBack = [];
            var pback = null;
            for ( var i = 0; i < $this.center.gridLandmarkOfRouter.RouteConfigBack.length; i++) {
                pback = $this.center.mapper.createPolygon(Mapper.DEFAULTPOLYGON, $this.center.gridLandmarkOfRouter.checkedPolygon());
                // Vẽ đường bao lộ trình
                pback.setOptions({ strokeColor: "#ff0080" });
                pback.setPath(getPointsPolygon($this.center.gridLandmarkOfRouter.RouteConfigBack[i].Polygon));
 
                $this.center.mapper.bindEvent(pback,"click", function () {
                    var options = {
                        strokeOpacity: 0.45,
                        strokeWeight: 3
                    };
                    // Duyệt qua và cập nhật lại giá trị mờ cho các polygon khác
                    polygon.setOptions({
                        strokeOpacity: 1,
                        strokeWeight: 10
                    });
                });
 
                // Thêm vào mảng
                $this.polygonBack.push(pback);
            }
 
Sau khi tìm hiểu thì do nó không phải dạng closure cho sự kiện click dùng asyn, mình đã chuyển lại sang dạng sau và nó hoạt động ngon.
 // Vẽ đường bao chiều về
        if ($this.polygonBack == null) {
            $this.polygonBack = [];
            for ( var i = 0; i < $this.center.gridLandmarkOfRouter.RouteConfigBack.length; i++) {
                var pback = $this.center.mapper.createPolygon(Mapper.DEFAULTPOLYGON, $this.center.gridLandmarkOfRouter.checkedPolygon());
                // Vẽ đường bao lộ trình
                pback.setOptions({ strokeColor: "#ff0080" });
                pback.setPath(getPointsPolygon($this.center.gridLandmarkOfRouter.RouteConfigBack[i].Polygon));
 
                (function (pback) {
                    $this.center.mapper.bindEvent(pback, "click", function () {
                        var options = {
                            strokeOpacity: 0.45,
                            strokeWeight: 3
                        };
                        // Duyệt qua và cập nhật lại giá trị mờ cho các polygon khác
                        pback.setOptions({
                            strokeOpacity: 1,
                            strokeWeight: 6
                        });
                    });
                })(pback);
 
                // Thêm vào mảng
                $this.polygonBack.push(pback);
            }
        }
 
 
            }
        }