mohitsgw / earth-api-samples

Automatically exported from code.google.com/p/earth-api-samples
0 stars 0 forks source link

setStyleSelector() does not update placemark when GEPlugin does not have focus #761

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
What steps will reproduce the problem?

1. Create placemark
2. Create html element (ie: table)
3. Create mouseover/mouseout event 
4. Attach event handlers to BOTH placemark and html element
5. Style changes are reflected properly via GEPlugin events, however styles do 
not update when called from HTML element (until GEPlugin recieves focus again)
[Sample html has been attached to this bug]

What is the expected output or behavior? What do you see instead?

The goal of this was to be able to have a html table listing of all placemarks 
in the GEPlugin, and have the placemark icon "highlight" based on mouseover 
either on the GEFeature itself, or by highlighting the applicable row in the 
table. To achieve this (since I have yet to find a way to manually fire 
GEvents) is to have a single mouseover/mouseout event handler and attach it to 
both the GEFeature and the html element, so regardless of which is highlighted 
the same function is executed. The function itself will simply change the style 
selector from a prebuilt normal/highlight style, and thus the icon will have 
the illusion of being highlighted regardless of what is triggering the events.

When actually running this code, when the events are called via the GEPlugin 
(mouse over/out of the placemark) all behavior runs as expected. However when 
the events are fired from the html object, the the style of the point is not 
updated until you click or mouseover the GEPlugin window. Using 
mouseover/mouseout events, this gives the appearance of no event handling 
whatsoever.

Which plugin version are you using?

6.2.1.6014

Which browsers and operating systems are affected?

IE7+ / FF

Please provide any additional information (code snippets/links) below.

This issue was initially reported in 2009 
(http://groups.google.com/group/google-earth-browser-plugin/browse_thread/thread
/34eb5209e6826bb3/bf29df9de7adf682), however it appears to have come back

Attached is a sample HTML page of the issue. There is a single placemark that 
when moused over behaves as expected, however when mousing over the table row, 
the feature's style does not change (however there are no JavaScript errors 
thrown, as the function processes successfully).

In addition, included are HTML buttons that replicate the issue that was linked 
above, where the style will not be updated until you mouseover/click the google 
earth window.

In addition you'll note a "bonus bug", in that the icon style set for the 
placemark (normalStyle) is not used, and instead the default icon is used.

Original issue reported on code.google.com by rws5...@gmail.com on 1 Mar 2012 at 5:10

Attachments:

GoogleCodeExporter commented 8 years ago
For anyone else who has run into this bug and needs a solution now, the hack I 
am currently using is to create a separate function to manually copy all the 
values into the current style for the feature. This causes it to update 
directly.

function setStyle(feature,style){
            if(feature.getStyleSelector() == null){
                feature.setStyleSelector(ge.createStyle(""));
            }
            // IconStyle
            feature.getStyleSelector().getIconStyle().setScale(style.getIconStyle().getScale());
            feature.getStyleSelector().getIconStyle().setHeading(style.getIconStyle().getHeading());
            feature.getStyleSelector().getIconStyle().setIcon(style.getIconStyle().getIcon());
            // LabelStyle
            feature.getStyleSelector().getLabelStyle().setScale(style.getLabelStyle().getScale());
            // LineStyle
            feature.getStyleSelector().getLineStyle().setWidth(style.getLineStyle().getWidth());
            // ListStyle
            feature.getStyleSelector().getListStyle().setMaxSnippetLines(style.getListStyle().getMaxSnippetLines());
            // PolyStyle
            feature.getStyleSelector().getPolyStyle().setFill(style.getPolyStyle().getFill());
            feature.getStyleSelector().getPolyStyle().setOutline(style.getPolyStyle().getOutline());
            // BalloonStyle
            feature.getStyleSelector().getBalloonStyle().setText(style.getBalloonStyle().getText());
        }

Original comment by rws5...@gmail.com on 1 Mar 2012 at 7:26