diff --git a/examples/README.md b/examples/README.md index ae042f461c..157b40caba 100644 --- a/examples/README.md +++ b/examples/README.md @@ -9,8 +9,7 @@ deploying using FastCGI or ISAPI. You typically need the following commands to run an example (`foobar`): cd foobar # source directory for example foobar - ln -s ../../resources . # include standard Wt resource files - ../../build/examples/foobar/foobar.wt --docroot . --http-address 0.0.0.0 --http-port 8080 + ../../build/examples/foobar/foobar.wt --docroot . --http-address 0.0.0.0 --http-port 8080 --resources-dir=../../resources By running the examples from within their source directory, in this way the examples will find the auxiliary files in the expected places. diff --git a/examples/leaflet/README.md b/examples/leaflet/README.md index 2bf7e7bea6..98af768a05 100644 --- a/examples/leaflet/README.md +++ b/examples/leaflet/README.md @@ -1,12 +1,19 @@ WLeafletMap example ------------------- +This example demonstrates the `WLeafletMap` widget, a simple wrapper around the [Leaflet JavaScript](https://leafletjs.com) library. How to run ---------- -See the README in the parent directory. +See the README in the parent directory, but add the `--approot=approot` argument. What it illustrates ------------------- +- Configuring the properties that allow `WLeafletMap` to find them in `approot/wt_config.xml`. +- Adding a tile layer (one that uses OpenStreetMap) +- Adding and removing a marker +- Adding a polyline +- Adding a circle +- Panning to different positions diff --git a/examples/leaflet/leaflet.C b/examples/leaflet/leaflet.C index 656343e07c..9a75056220 100644 --- a/examples/leaflet/leaflet.C +++ b/examples/leaflet/leaflet.C @@ -18,15 +18,11 @@ public: private: Wt::WLeafletMap *map_; Wt::WLeafletMap::Marker *marker_; - Wt::WSpinBox *zoomLevelSpinBox_; bool markerAdded_; void panToEmweb(); void panToParis(); void toggleMarker(); - void zoomToLevel(); - void panChanged(double lat, double lng); - void zoomLevelChanged(int zoom); }; LeafletApplication::LeafletApplication(const Wt::WEnvironment &env) @@ -37,17 +33,20 @@ LeafletApplication::LeafletApplication(const Wt::WEnvironment &env) { map_->resize(500, 500); + // Add OpenStreetMap tile layer Wt::Json::Object options; options["maxZoom"] = 19; options["attribution"] = "© OpenStreetMap contributors"; - map_->addTileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", options); + // Pan to Emweb map_->panTo(Wt::WLeafletMap::Coordinate(50.906705, 4.655800)); + // Add marker map_->addMarker(marker_); markerAdded_ = true; + // Add a polyline from the center of Leuven to Emweb std::vector points; points.push_back(Wt::WLeafletMap::Coordinate(50.9082, 4.66056)); points.push_back(Wt::WLeafletMap::Coordinate(50.90901, 4.66426)); @@ -117,6 +116,7 @@ LeafletApplication::LeafletApplication(const Wt::WEnvironment &env) pen.setWidth(3.0); map_->addPolyline(points, pen); + // Add a circle around Emweb Wt::WBrush brush = Wt::WColor(0, 191, 255, 100); map_->addCircle(COORD_EMWEB, 50.0, pen, brush); @@ -128,13 +128,6 @@ LeafletApplication::LeafletApplication(const Wt::WEnvironment &env) Wt::WPushButton *toggleMarkerBtn = new Wt::WPushButton(Wt::utf8("toggle marker"), root()); toggleMarkerBtn->clicked().connect(this, &LeafletApplication::toggleMarker); - - zoomLevelSpinBox_ = new Wt::WSpinBox(root()); - zoomLevelSpinBox_->setRange(0, 19); - zoomLevelSpinBox_->changed().connect(this, &LeafletApplication::zoomToLevel); - - map_->panChanged().connect(this, &LeafletApplication::panChanged); - map_->zoomLevelChanged().connect(this, &LeafletApplication::zoomLevelChanged); } LeafletApplication::~LeafletApplication() @@ -167,23 +160,6 @@ void LeafletApplication::toggleMarker() } } -void LeafletApplication::zoomToLevel() -{ - map_->setZoomLevel(zoomLevelSpinBox_->value()); -} - -void LeafletApplication::panChanged(double lat, - double lng) -{ - std::cout << "lat: " << lat << ", lng: " << lng << '\n'; -} - -void LeafletApplication::zoomLevelChanged(int zoom) -{ - std::cout << "zoom: " << zoom << '\n'; - zoomLevelSpinBox_->setValue(zoom); -} - Wt::WApplication *createApplication(const Wt::WEnvironment &env) { return new LeafletApplication(env);