Questions about WLeafletMap

hi,

1. Is it possible to respond to a click on the map and get the coordinates that were clicked ?

2. Is it possible to deduct the coordinates of the bounding box of the map in its current state ?

Suppose I have a database of map markers that I would like to place on the map, but I want to place on the map only the markers that will be actually shown.

I would like to be able to filter out markers based on the coordinates of the top left and bottom right.

I assume it is possible to calculate these coordinates based on the position() + zoomLevel() + width() + height() ?

Replies (6)

RE: Questions about WLeafletMap - Added by Samuel Quevauvillers over 3 years ago

Hi,

Signals and some injected JS will do the job.
Did you already did it ?

No need to calculate, you can get the extent or center as coordinates from the ol.map object

RE: Questions about WLeafletMap - Added by Or Goshen over 3 years ago

I havent done it yet
Would greatly appreciate if you had an example or some code to share ?

RE: Questions about WLeafletMap - Added by Samuel Quevauvillers over 3 years ago

I just noticed you are using leaflet but I used openlayer...

slot.setJavaScript(
  "function (x,y){"
  "var f = map.getCoordinateFromPixel([x,y]);"
  "if (f != null) {"
  + signal.createCall({"f[0]","f[1]"}) + "}}" );

this->doubleClicked().connect(this->slot);

this is a WContainerWidget containing the map. You can connect with ohter control such as WPushButton.
The map is created with injected JS.

To get the extent, the JS is :

var centre = map.getView().getCenter();
var extent = map.getView().calculateExtent(map.getSize());

RE: Questions about WLeafletMap - Added by Or Goshen over 3 years ago

Thanks,

To the best of my knowledge only leaflet and google maps are support by WT without adding external code ?

RE: Questions about WLeafletMap - Added by Samuel Quevauvillers over 3 years ago

I think so.
We had to add openlayer JS lib with require("lib...js") then init the map with injected js.

RE: Questions about WLeafletMap - Added by Harald Elmer about 3 years ago

I managed issue 1.) as follows:

Derive my own Class SiLeafletMap from WLeafletMap
Implement a new Signal mapClicked
Override render to inject Javascript

class SiLeafletMap : public Wt::WLeafletMap
{
public:
    SiLeafletMap();
    JSignal<double, double> &mapClicked() { return signalMapClicked_; }

protected:
    virtual void render(WFlags< RenderFlag > flags) override;
    JSignal<double, double> signalMapClicked_;
};

SiLeafletMap::SiLeafletMap() :
        WLeafletMap(),
        signalMapClicked_(this, "mapClicked")
{

}

void SiLeafletMap::render(WFlags< RenderFlag > flags)
{
    WLeafletMap::render(flags);

    WStringStream ss;
    ss << "var m=" << mapJsRef() << ";"
        " var o=" << jsRef() << ";"
        " if (o && m) { m.on('click', function(e) { "
        " Wt.emit(o, 'mapClicked', e.latlng.lat, e.latlng.lng); "
        "}"
        "); }";
    if (!ss.empty())
    {
        doJavaScript(ss.str());
    }
}

In your implementation connect signal to your handler e.g.

class MyClass {

   //other code 

   auto map = layout->addWidget(Wt::cpp14::make_unique<SiLeafletMap>(), 1);
   map->mapClicked().connect(std::bind(&MyClass::MyHandler, this, std::placeholders::_1, std::placeholders::_2));

   void MyHandler(double, double) {

   }

};

Studying of WLeafletMap.h, WLeafletMap.C and WLeafletMap.js might help to implement other features !

(1-6/6)

Project

General

Profile

Wt