bind an icon

Jun 29, 2009 at 12:52 PM

Hi,

I try to add a property to bind an icon so I add the property DataIconField and changed the PerformDataBinding Method :

 

protected override void PerformDataBinding(IEnumerable data) {
            base.PerformDataBinding(data);

            if (data != null) {
                bool hasAddressDataField = !string.IsNullOrEmpty(DataAddressField);
                bool hasLatitudeDataField = !string.IsNullOrEmpty(DataLatitudeField);
                bool hasLongitudeDataField = !string.IsNullOrEmpty(DataLongitudeField);
                bool hasTextDataField = !string.IsNullOrEmpty(DataTextField);
                bool hasIconDataField = !string.IsNullOrEmpty(DataIconField);
                bool hasTitleDataField = !string.IsNullOrEmpty(DataTitleField);
                GoogleMarker marker;
                foreach (object dataItem in data) {
                    marker = new GoogleMarker();
                    if (hasAddressDataField)
                        marker.Address = DataBinder.Eval(dataItem, DataAddressField, "");
                    if (hasLatitudeDataField)
                        marker.Latitude = JsUtil.ToDouble(DataBinder.Eval(dataItem, DataLatitudeField, ""));
                    if (hasLongitudeDataField)
                        marker.Longitude = JsUtil.ToDouble(DataBinder.Eval(dataItem, DataLongitudeField, ""));
                    if (hasTextDataField)
                        marker.Text = DataBinder.Eval(dataItem, DataTextField, "");
                    if (hasIconDataField)
                        marker.IconUrl = DataBinder.Eval(dataItem, DataIconField, "");
                    if (hasTitleDataField)
                        marker.Title = DataBinder.Eval(dataItem, DataTitleField, "");
                    this.Markers.Add(marker);
                }
            }
        }

 

It works fine when I bind but when the page makes a postback, the icons desappear. All markers still have the iconUrl but they are not visible on the map.

Any idea why?

 

Thanks

 

Jun 30, 2009 at 8:45 AM

 

I found why the icon deappears after a postback.

In function createIcon in GoogleMap4.js, the icon width and the icon height are set to 0. 

 

createIcon: function() {
        var icon = null;
        if (this.IconUrl) {
            icon = new GIcon();
            icon.image = this.IconUrl;
            if (this.IconSize)
                icon.iconSize = new GSize(this.IconSize.Width, this.IconSize.Height);
            if (this.IconAnchor)
                icon.iconAnchor = new GPoint(this.IconAnchor.X, this.IconAnchor.Y);
            if (this.InfoWindowAnchor)
                icon.infoWindowAnchor = new GPoint(this.InfoWindowAnchor.X, this.InfoWindowAnchor.Y);
            if (this.ShadowUrl)
                icon.shadow = this.ShadowUrl;
            if (this.ShadowSize)
                icon.shadowSize = new GSize(this.ShadowSize.Width, this.ShadowSize.Height);
        }
        return icon;
    },

I don't understand why icons don't keep their default size, default iconAnchor.....

 

Jun 30, 2009 at 12:44 PM

I resolved my probleme

There is a bug when the markers are saved :

it misses "" around some properties such ( IconSize width and Height, IconAnchor X and Y, InfoWindowAnchor X and Y, ShadowSize Width and Height)

So after a post when the googlemap compiosant read what was saved, it fails loading those properties.

 

I changed the save function in the GoogleMap4.js to : (In green what I changed (just added some \")

 

save: function() {
        var state = "{";
        //
        state += "\"Address\":\"" + this.Address + "\",";
        state += "\"AutoPan\":" + this.AutoPan + ",";
        state += "\"Bouncy\":" + this.Bouncy + ",";
        state += "\"Clickable\":" + this.Clickable + ",";
        state += "\"Draggable\":" + this.Draggable + ",";
        state += "\"DragCrossMove\":" + this.DragCrossMove + ",";
        if (this.IconAnchor)
            state += "\"IconAnchor\":{\"X\":" + this.IconAnchor.X + ",\"Y\":" + this.IconAnchor.Y + "},";
        if (this.IconSize)
            state += "\"IconSize\":{\"Width\":" + this.IconSize.Width + ",\"Height\":" + this.IconSize.Height + "},";
        state += "\"IconUrl\":\"" + this.IconUrl + "\",";
        if (this.InfoWindowAnchor)
            state += "\"InfoWindowAnchor\":{\"X\":" + this.InfoWindowAnchor.X + ",\"Y\":" + this.InfoWindowAnchor.Y + "},";
        var point = this.getLatLng();
        if (point) {
            state += "\"Latitude\":" + point.lat() + ",";
            state += "\"Longitude\":" + point.lng() + ",";
        }
        else {
            state += "\"Latitude\":" + this.Latitude + ",";
            state += "\"Longitude\":" + this.Longitude + ",";
        }
        state += "\"OpenInfoBehaviour\":" + this.OpenInfoBehaviour + ",";
        if (this.ShadowSize)
            state += "\"ShadowSize\":{\"Width\":" + this.ShadowSize.Width + ",\"Height\":" + this.ShadowSize.Height + "},";
        state += "\"ShadowUrl\":\"" + this.ShadowUrl + "\",";
       
        state += "\"Title\":\"" + this.Title + "\",";
        //
        state += "}";
        return state;
    },

 

 

Coordinator
Jul 7, 2009 at 10:55 AM

Hi,

Thanks a lot mate. I will update the source ASAP.

Regards