jorix / ol-featurepopups Goto Github PK

We had installed your module olfp but we have some problem with the cluster's popups.
In the picture you can see that, if I have a lot of item in the cluster, popup background has some problems! I tried to set a max-height but this solution creates problem with background and scroll. I can't understand what and WHERE can I fix this problem.

(Reported by Maria Elena through other means)

The references:

• The sandbox of the Drupal Experimental Project branch: "7.x-2.x"
• The Drupal OL issue

I try this great tool OL-FeaturePopups (thanks!) and everything works fine besides click a link.

I have WFS layer (geoserver + postgis).
The layer: [wc_tab_reg] has attributes:
fid:.[v_wzl_tab_regulacyjne.fid--3fa1d856_15239af50e5_-268e] - it's GeoServer id
gis_id: [30321]
adres_wezla: [Mieszka I 11]
tab_regulacyjne: [Mieszka I 11: 80/55]

My popup code:

 var fpControl = new OpenLayers.Control.FeaturePopups({
 boxSelectionOptions: {},
 layers: [ [...],
      wc_tab_reg, {templates: {
      // hover: single & list
         hover: '${.adres_wezla}',
         hoverList: '<b>${count}</b><br>${html}',
         hoverItem: '${.adres_wezla}<br>',
      // select: single & list
         single: '<div><h2>${.adres_wezla}</h2>${.tab_regulacyjne}</div>',
         item: '<li><a href="#" ${showPopup()}>${.adres_wezla}</a></li>'
                }}]
    ] });

And popup is displayed after selected features cluster, I have list of links, but when click on link nothing happens...

I wonder whether it is caused by a WFS layer? In example there is KML source of features.

And structure wfs feature from browser devTools:

My version OL2 - 2.13.1

I have FeaturePopups used on page load. it plots the data passed from the db to the map and works fine.

Once data is filtered and new data is passed through json the popup works on hover but it sticks with the mouse pointer and goes wherever the mouse pointer goes.

fpControl = new OpenLayers.Control.FeaturePopups({
 layers: [ layer data ]
});

map.addControl(fpControl);

I have an Issue since I integrated FeaturePopups into my code and I don't know where to look anymore. Maybe it's not because of FeaturePopups anyway. Has this been tried by someone maybe?

Problem is I cannot select a drawn feature by clicking on it anymore. When I don't add the FeaturePopups-Control to the map at start, modifying works again. I looked through the FeaturePopups.js but didn't find anything that could interfere with the ModifyFeature. Both Controls use separate and different Layers.

I'm using a mixture of ExtJS 4 and OL2.13 and I justshow some snippets, hoping it's enough for the first view.

Substantiating the FeaturePopup control:

        var fpControl = new OpenLayers.Control.FeaturePopups({
            boxSelectionOptions: {},
            id: 'idGeomaerkerFeatureInfo',
            popupOptions: {'single': {closeBox: true, popupClass: OpenLayers.Popup.Anchored}},
            // mode: 'NONE',
            layers: [
                [
                // Uses: Templates for hover & select and safe selection
                geomaerkerlayer_points, {
                    templates: {
                        // hover: single & list
                        // hover: '${.status}',
                        hover: function(feature){
                            switch(feature.attributes.status) {
                                case "ungeprueft":
                                    return '<table width="370px" style="background-color:#E9F2FF; margin-left:0px; font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; font-size:10pt; border-spacing: 0px;">'

                                     ...

    map.map.addControl(fpControl);

Initiating the ModifyControl and some other:

        this.drawLayer = new OpenLayers.Layer.Vector('GeomaerkerDraw');
        this.drawLayer.displayInLayerSwitcher = false;
        this.drawLayer.setVisiblitiy = false;

        this.polygonDraw = new OpenLayers.Control.DrawFeature(
                this.drawLayer, OpenLayers.Handler.Polygon);
        this.polygonDraw.handler.stopDown = true;
        this.polygonDraw.handler.stopUp = true;

        this.modify = new OpenLayers.Control.ModifyFeature(this.drawLayer);
        this.modify.mode = OpenLayers.Control.ModifyFeature.RESHAPE;

        this.drawLayer.events.on({"beforefeatureadded": function(){
            if (this.features.length > 0){
                this.removeFeatures(this.features[0]);
            }
        }});

        ...

    /**
     * Activate the tool to modify previously drawn features.
     */
    modifyFeature: function(button) {
        this.deactivate();
        this.deactivateOthers();
        this.modify.activate();
    },

I would really appreciate it getting some help here. After all I really like the FeaturePopups and don't want to miss it. Thanks

Hi Jorix,

I need to open a new page on feature click, on a layer using clustering.
This code works fine for features on a cluster popup, but for single features it opens a popup before loading the new page:

single: function(feature) {
   location.href = "new-url.php?id=" + feature.attributes.id;
},

What should I do to not open the popup on single features click?
I tried with return false; but nothing happens.
It works if I use exit() after the location.href... line, but because this generates a JS error :)

Thank you!

I believe the following could fix the issue, but I'm not sure about what other consequences my fix could have, so I'll post here:

Line 418 is
var layers = this.layers || [this.layer];
but should be
var layers = self.layers || [self.layer];

Line 888 is
delete this.layerObj[layer.id];
but should be
delete this.layerObjs[layer.id];

Hi Jorix!

I would like to show a live camera stream on popup and I have a Java Script code ready.
It should work with something like this, but it doesn't work:

single: "<script src='/gateway-live-camera.js.php?id=20' type='text/javascript'></script>"

I tried but it is not working even with simple Java Script as:

single: "<script lang='javascript' type='text/javascript'>document.write('just a test!')</script>"

I made some tests with an html table outside of the script sequence to set some space, but nothing is generated inside this space.
The code is showed with no errors in Firebug, but nothing happens, it looks like it is not interpreted.

If document.write test will work I need to have a Java Script embedded and I have to situations:

1. local JS file
2. remote JS file.

I am afraid remote JS file will not be permitted because of security reasons.
What do you think about this?

Thank you!
Bogdan

PS:
I asked for help on GIS forum here http://gis.stackexchange.com/questions/41144/insert-javascript-code-in-popup-framedcloud.
I think I can't try setContentHTML() with your library, but I will try iframes.

When I click a cluster (select) and there's a long list of features it doesn't fit the popup form.
For example a list of 35 features doesn't fit and creates a 'new form' at the bottom of the main popup form.
Is it possible to specify the max form size (height) and add a vertical scroll bar ?

Open in the thread Disperse Overlapping points/markers after loading of list DEV list

Is it possible to display "decimal number" attribute value - such as "14.25" in the Feature Popup?
example:
...hover: '${.LENGTH}' <--- returns undefined

Many thanks!

Hi Jorix!

The control you developed is very useful for me, thank you!
I have used it here http://www.trafficguide.ro/.

I have some questions which I asked for support on http://gis.stackexchange.com, but it looks that too few people is using this control. So I will ask you for support if possible.

I am using cluster popups and there is a small design problem in my opinion: the event popup have the same anchor as the cluster popup and they partial or total overlap.
Is it possible to anchor the second (event) popup on the link on first (cluster) popup?

I think if you give a short answer on the forum (http://gis.stackexchange.com/questions/41483/how-to-not-overlap-cluster-popups-with-featurepopups-control) you will create some more visibility for your control.

Thank you,
Bogdan

If popup position is /top-right/bottom-left/bottom-right/ all right. If position is top-left, then move mouse popup flickers.
What could be the reason for such behavior?

This effect can be observed in example:
http://jorix.github.io/OL-FeaturePopups/examples/feature-popups.html
if you move mouse pointer from the bottom right to the top left.

Is it possible to load the popup content via XHR?
In the callback function I can immediately return content, I need this to create a loading animation and I could start the XHR asynchronously, but still need a handle to the popup to load the HTML into when the XHR is finished. I use a custom popup class that supports the content loading.

Something like this would be great:

                hover: function(feature, popup) {
                    popup.loadContent(feature.popupUrl);
                    return '<img src="loading-anim" />';
                },

Hi Jorix,

We found a bug on iPad with cluster popup.

When you click a link on a cluster popup, the click is transferred to the child popup and if in the click area there is a link it is followed immediately.

I see this on Safari / iPad3 / iOS 6 on this page http://test2.trafficguide.ro/ when you click on a live camera cluster icon.

Please take a look!

Thank you,
Bogdan

We need help to fix a problem with our drupal's site.
We had installed module olfp. We would like to change font size and similar by css but the popup doesn't autosize correctly. If we set a larger font the popup doesn't change and it cuts the content. Could you tell us how set a static size or how have a popup dimensioned correcty?

thank very much,

MEB

(received via email)

Hi!

I need to add a condition like this:

item:   function(feature) {
   return '<li><a href=\"#\" ${showPopup()}>' + feature.attributes.name + '</a>' +
      (feature.attributes.available == "0" ? " (unavailable)" : "") + '</li>';
},

In this example the "${showPopup()}" template does not work.

But if I use

item:   '<li><a href=\"#\" ${showPopup()}>' + feature.attributes.name + '</a>' +
      (feature.attributes.available == "0" ? " (unavailable)" : "") + '</li>',

feature object does not exists.

Which is the correct syntax?
Thank you!

I use a filter strategy and I'd like to programmatically select the feature (selectShow popups) instead of an user click. Is this possible ?

Hi,

We have a problem with the OL-FeaturePopups module in Drupal 7. The popups are working great with a WFS layer, but when we enable it on a JSON layer, the features are placed randomly on the map. When we click them, the pop-up moves to the correct location of the feature. If we disable the functionality on the same layer, the feature show up on the correct position.

Our setup uses Drupal with Cartaro distribution, OpenLayers 7.x-2.0-beta11 and OpenLayers Feature Popups 7.x-2.0-dev. Our map is in EPSG:28992 projection as well as the JSON data.

Can you please help us with this problem?

Hello! I tested http://jorix.github.io/OL-FeaturePopups/examples/feature-popups.html, works like a charm on Win7 FF24, android browser and chrome on android. (the mobile browsers open popup instead of tooltip on touch as expected)

Now I implemented your control in my application and got some problems: FF24 works as expected but android browser shows the hover tooltips instead of the single popup and android chrome doesn't show anything.
Can currently be seen under: http://regio.vrok.de

Do you have any idea why this could be? There are no other SelectFeature controls enabled and there are no browser switches implemented from my side.

       map.addControl(new OpenLayers.Control.FeaturePopups({
            layers: [[this.layers[layerName], {templates: {
                hover: function(feature) {
                    return feature.attributes.tooltip;
                },
                single: '<div><h2>${.name}</h2>${.description}</div>'
            }}]],
            popupOptions: {
                hover: {
                    popupClass: OpenLayers.Popup.CustomTooltip,
                    followCursor: false,
                    anchor: {
                        size: new OpenLayers.Size(0,0),
                        offset: new OpenLayers.Pixel(0,0)
                    }
                },
                single: {
                    popupClass: OpenLayers.Popup.CustomPopup
                }
            }
        }));

Don't know how to write direct messages on github, so I'll ask here. If the description is long popup stretches through the screen. Is it possible to set width of a feature popup?

I have a vector layer containing features loaded by a bbox strategy, so the aren't loaded when not on the map.
If I open a popup of such a feature and close it again, then scroll the map so the feature disappears and then scroll it back in the popup opens again.
This should not happen, a popup closed by the closebox or clickout should not be opened again.

local featurePopups version: 1.1.0
browser: FF24

After closing a features popup with the closebox it cannot be opened again, only after clicking another feature.

Test:
http://jorix.github.io/OL-FeaturePopups/examples/feature-popups.html

• click sprinter feature or "my ... title" feature > popup opens
• click closebutton > popup disappears
• click same feature again > no popup
• click other feature > new popup opens
• click old feature > old popup shows again

This also does not work on my installation with a vector layer containing features with graphic/backgroundgraphic.
Opening a popup again on a Sundial feature works.

local featurePopups version: 1.1.0
browser: FF24

I have features with the same name on a map (ends of road segments with incidents) and they appear as duplicates on tooltips and popups. Please give me an advice about how to remove duplicates and keep only features with unique names on tooltips and popups created with FeaturePopups control.

I asked for support for this problem here also:
http://gis.stackexchange.com/questions/41471/remove-duplicate-names-in-featurepopups-cluster-tooltips-and-popups

Thank you,
Bogdan

Hello Jorix !

I use your library for make popups on my features.

But I have a problem. Without your library, if I put my mouse over the features (markers with images) I have no problems.
But if I use your library, if I put my mouse over my features, these blink/flash...

To use your library on my features i do that :

select = new OpenLayers.Control.FeaturePopups({
          selectionBox: true,
          layers: [[
          vector2 , {templates: { 
hover: "${.name}",
               single:"\<p style=\"color : red;\">description : ${.address}\</p>",
               item: "\<li>\<a href=\"#\" ${showPopup()}>${.name}\</a>\</li>"
           }}
           ]]
       });
map.addControl(select);
select.activate(); 

Have you go an idea to fix that ?
Have you got more informations about this problems ?

Thanks a lot ;)

Hello Xavier,

I have updated the module to work with the upcoming version of OpenLayers.
I also integrated some options to configure the popupClass; some users would like to display popup outside the map viewport.

While I was doing it, I wondered if it's possible to configure those options per layers instead of globally.

Let me know if it's possible or not and I'll implement it in my module :-)

Thanks !

I have a fixed size FramedCloud Popup that I want to position relative to the point calling it, always above the point and with its right side 50px to the right of the point. How can i do this with FeaturePopups. Because now it changes popup possition according to the angle of feature is hovered.

I use this for my popup;

hover: ${.description},

How can i replace a part of "${.description}" ?
I've already tried a lot but no luck so far.

More specific the description contains the path to a thumbnail.
I'd like to replace the relative path <img src="..... for the full path <img src=" /uploads/.....

The easiest way for me is using a fuction and check if it's a relative path or already a full path.
I'm completely stuck.

I have several layers, some of them with pictures (left pic).
When adding a layer with a line in FeaturePopups, it overlaps the other layers.
OpenLayers 2.13

//FeaturePopups without layerWithLine (left pic)
var fpControl = new OpenLayers.Control.FeaturePopups({
    layers: [
        [     
        layerOnTop, {templates: {           
            hover: "test"
        }}]
    ]
});
map.addControl(fpControl);

//When adding a layer with a line to FeaturePopups, it overlaps the other layers (right pic).
var fpControl = new OpenLayers.Control.FeaturePopups({
    layers: [
        [     
        layerOnTop, {templates: {           
            hover: "test"
        }}], [
        layerWithLine, {templates: {
            hover: "line"
        }}]
    ]
});
map.addControl(fpControl);

Hello,

Is it possible to enable the tooltips without enabling the popup feature (onclick) ?

Thanks.

It's really big pity that there isn't such FeaturePopups for OL-3.
This is my best addition.
Maybe there are any chanses ... ?
Anyway many thanks for OL-FeaturePopups.

Do you have a simple solution to close all popups when the user zoom in or out?
Because after this operation the popup does not close when you click outside of it.

I think this is an Openlayers bug. I found online references about this from 2009.
Thank you!

I have not found an option to define wether or not tooltips (on hover) are opened on the cursor position or at the features center. Popups (on click) seem to get opened always at the feature center.

OpenLayers.Control.FeaturePopups_Utils.showListPopup already supports a parameter "useCursorLocation", could this be added to the popupOptions.hover object?