Waymark icon indicating copy to clipboard operation
Waymark copied to clipboard

Wordpress properties in GeoJSON

Open DrogoNevets opened this issue 1 year ago • 8 comments

Firstly, thanks for such a great plugin!

I was wondering if its possible, and if so how, to have when viewing a collection map, if i select on a feature, to get that features post_id in the properties?

My use case is I have added a button to the pop up, and on clicking that button it will fire off an ajax request that will make that map as selected (custom logic) and then remove it from the original collection

The removing from collection is easy enough, as long as i know the map (post) id...?

DrogoNevets avatar Jan 09 '25 14:01 DrogoNevets

By feature, i mean the map that feature belongs to post_id

DrogoNevets avatar Jan 10 '25 10:01 DrogoNevets

Obviously this isn't an appropriate way of doing, but the kind of thing I am after is something similar to the below snippet added to line 167 of inc/Objects/Waymark_Object.php

This enables me to get access to the post id in my javascript, allowing my ajax call to manipulate certain things within my own plugin

perhaps adding in an action that allows mutation of the $param_value before saving, that a plugin can tie into?

$json = json_decode(wp_unslash($param_value));
foreach($json->features as $feature) {
	$feature->properties->post_id = $post_id;
}
$param_value = json_encode($json);

DrogoNevets avatar Jan 10 '25 14:01 DrogoNevets

a workaround that seems to work, though this is more at the leaflet level rather than the waymark level so there might be a better solution i've not found yet

const enrichPopups = (waymark) => {
  if (typeof Waymark !== "object" || typeof jQuery !== "function") {
    console.error("Waymark or jQuery not loaded");
  }

  const map = waymark.map;

  map.eachLayer((layer) => {
    if (typeof layer.toGeoJSON === "function") {
      if (!layer._popup) {
        return;
      }
      const popup = layer._popup;
      const popupContent = popup._content;
      const $popupContent = jQuery(popupContent);

      const button = document.createElement("button");
      button.textContent = "Click me!";
      button.addEventListener("click", () => {
        map.closePopup();
        waymark.map.fitBounds(layer._bounds);
      });

      $popupContent.children("ul").append(button);
    }
  });
};

Thanks for sharing, I have put together a modified version of this here. The code:

const enrichPopups = (waymark) => {
  if (typeof Waymark !== "object" || typeof jQuery !== "function") {
    console.error("Waymark or jQuery not loaded");
  }

  waymark.map_data.eachLayer((layer) => {
    if (typeof layer.toGeoJSON === "function") {
      if (!layer._popup) {
        return;
      }

      const popup = layer._popup;
      const popupContent = popup._content;
      const $popupContent = jQuery(popupContent);

      const button = document.createElement("button");
      button.textContent = "View Properties!";
      button.addEventListener("click", () => {
        alert(JSON.stringify(layer.feature.properties));

        waymark.map.closePopup();
      });

      $popupContent.children("ul").append(button);
    }
  });
};

perhaps adding in an action that allows mutation of the $param_value before saving, that a plugin can tie into?

I think this is a good idea.

Just to be clear - you are looking for the ability to modify each Overlay's (Marker/Line/Shape) feature.properties, i.e. the data that is included in the alert()? And in your case you are looking to add the Map post_id, so in a Collection it would contain the appropriate post_id for the Map that the Overlay belongs to?

I hope I have that right.

morehawes avatar Jan 10 '25 20:01 morehawes

Releated to #45

morehawes avatar Jan 10 '25 20:01 morehawes

hi @morehawes yes that is exactly correct - I am basically trying to get to the point of adding a button that will change the colour of the feature(s) added

Will have a look at your modified version and get back to you after my meeting

DrogoNevets avatar Jan 13 '25 10:01 DrogoNevets

@morehawes https://github.com/OpenGIS/Waymark/pull/57 here is a PR to do the above as described

It registers a filter and passes $param_value through to it, it expects $param_value back which will be the modified value

DrogoNevets avatar Jan 13 '25 15:01 DrogoNevets

@morehawes #57 here is a PR to do the above as described

It registers a filter and passes $param_value through to it, it expects $param_value back which will be the modified value

Thanks for this, please see my comment there.

hi @morehawes yes that is exactly correct - I am basically trying to get to the point of adding a button that will change the colour of the feature(s) added

OK great. Your PR modifies the post meta upon update through admin, which I think is a nice filter to add.

My first thought was to add a filter that modifies the map_data GeoJSON before it gets rendered on the front-end. It is already getting modified to add a Collection link to the description, so perhaps this could be changed to use a filter that plugins could also hook in to.

It might be nice to have filters for both.

morehawes avatar Jan 13 '25 22:01 morehawes

I have added the waymark_pre_update_post_meta filter for modifying meta upon update.

I am going to explore if there is a read-only way of doing this also.

morehawes avatar Jan 14 '25 17:01 morehawes