greenstand / treetracker-web-map-client Goto Github PK

If there is only one tree in a circle, user should be able to navigate to the tree details directly. Now the user has to click sometimes even 7 times to get to the tree/user details. This takes quite a big amount of time to show the tree details.

Details:
All mobile devices and desktop

The tree marker is inaccurate, the tip of the point is not pointing to the correct/accurate coordinate on the map:
We need to make some calibration to make it correct.

See screenshot. Adding a simple "copy link" would also be a great addition. This is a simple task for entry level contributors.

Is there a way to add analytics to the share dialogue ?
We might also consider more than just "Share" (TBD)

Currently, the app has been handled with some case like: treetracker.org/?map_name=freetown, in this case, the timeline filter will be hidden, we also need it be hidden in the case: freetown.treetracker.org

We have some links out there such as
https://treetracker.org/?userid=3737
needs to be rerouted to ....
https://map.treetracker.org/?userid=3737

Currently a pretty strong error comes up.

"Greenstand" logo in the bottom right corner should have a link to the Greenstand website if possible. Most probably this is not a bug as such, just an improvement.

Details:

https://map.treetracker.org/?map_name=mytreestrust

working case: https://map.treetracker.org/?userid=3717 they are the same.

We will assign tree names to some trees

We want to show the single capture view using a URL like
map.treetracker.org/leaf-love-sustain

Also change the left panel to show the tree name as well.

Zaven will update the backend API to support a query parameter to GET a single capture using the name

Test body

Even there are icons on the map.

https://www.loom.com/share/0f374c77ff37473d89696ae698b4efb8

Because the timeline is slow sometimes.

Details:
iPhone SE, Chrome

Similar to google maps, the URL of the treetracker map should contain the bounding box information for the location currently shown. This should change as the user navigates in the map. The user should be able to copy and paste this URL in order to share the current map view: when a URL with a bounding box query parameter is accessed, the map should move to the location of this bounding box.

For example, on maps.google.com we have: https://www.google.com/maps/@37.8508569,-122.2524834,17.11z

Like this case: https://map.treetracker.org/?map_name=wscm
We need to check if the previous code is working to set the initial view for the organization map (map_name=xxx)
So we can consider using a good setting for it.

On the right-bottom corner, we need to display approricate map copyright information.
We are using: google satellite map as background, leaflet library.

There is a Search feature missing a lot. Search by a user, by id. This would be very nice to have.

Upon completely zoom in on one tree (number 1 in a circle, not map pointer yet) sometimes user can see an arrow pointing/suggesting to move to left/right but in fact the tree is already presented on the screen.

Details:
iPhone 12, Chrome

Marked as (2) on the above mockup. Should be a small panel showing the name and logo of the sponsor. We are waiting on a way to upload sponsor logos, placeholders can be used until then. see Ezra's comment below! Feel free to ask me if you would like to tackle this issue or need any help.

https://map.treetracker.org/?userid=2268

Fixed them in branch old-version need to merge them to the new version/master.

The map needs to show Powered by Greenstand on all maps. Custom logos should be displayed elsewhere. We will provide a lockup spec for combining the Powered by Greenstand lockup with the custom Brandmark or Lockup of the organization's map.

https://www.figma.com/file/l9GrplCZEyRF44uRHSpoIY/Web-Map?node-id=301%3A2

Be awesome and make this super Impact Panel design!

• The data should be pulled from all trees belonging to a specific 'entity_id'

• In the case of a master 'entity_id' it should contain all trees linked to that wallet and the sub-wallets of that entity.

• Color codes should be used: Primary green #86c232, Secondary green #61892F, Orange #FFA500

• Must be mobile friendly.

• You will need the graphical arrow asset such as this
  

• You will need to figure out how to make this map (Note, it will be worth reading up on how we have done the clustering on the main map as a lot of this work will already have been completed)

Changes from design:

• Name on top of panel should be changed to "Impact Panel"
• Should only say "Impact panel" once. It should not be over the little map portion as well.
• The time function (as shown by the "Last 7 days" need not be added. But it is cool so if you can add it cool.

When zoomed in (not fully) it is very hard to move on the map. The map sometimes doesn't react to the user fingers and only stays where is.

Details:
Samsung 10, iPhone SE (Chrome)

No trees/clusters show up on this URL, need to check what happened in this case.

Since the new version uses raster tiles to serve tree locations, we have to change our approach to the 'next tree' feature (arrows on the tree to photo to move show the next tree)

Suggested solution:
When a user first clicks on a tree and opens the side panel, load ~100 trees that are close to this tree. Keep these trees in a cache and use them to page through until the user selects a tree that is not nearby or moves the map.

To load trees:
First try a .01 degree by .01 degree bounding box around the selected tree using a bounding box query for tree points ( such as https://prod-k8s.treetracker.org/webmap/trees?clusterRadius=0&zoom_level=17&bounds=37.4277001224301,-3.3264942011693543,37.41518600805022,-3.336982120489781). If there are no trees returned, try again with a .1 by .1 degree bounding box, then a 1 x 1 degree bounding box until trees are found within the shown bounding box to step through.

https://wallet.treetracker.org/?wallet=Michael_R

There was some problem in this case before, check it in the new version.

Quick wallet UX upgrade

Want to show
Total number of tokens in wallet
Total number of planters connected to tokens in wallet
Total number different species connected to tokens in wallet

Show these each as changing graphs/charts over time, on a monthly basis
Implement as a bottom panel to the wallet map only (not the main maps)

Also include some basic information about the wallet.

Three graphs horizontally along the bottom

NOTE: the freetown.treetracker.org case

https://www.loom.com/share/44fa1429908742dbb3ae5b603ed73ad5

The https://treetracker.org site should open up with the left panel active. We need UX UI help to define what to display there. A short introduction (if no cookies are present) of the project and what this is about. Maybe a bit of statistics ... Amount of total tree tracking events, mabye statistic by continent, once in continent by country, or markers such as how many FMNR trees, social impact counter etc.
Planter of the months, last active tracking, etc

https://treetracker.org/?map_name=TheHaitiTreeProject. The initial zoom that is calculated turns out to be at the wrong location.

Leaflet link in the bottom right corner has no css styles applied and therefore it doesn't look nice. Do we need to have it from legal point of view?

Details:

There is some deviation

Raj from the greening India project has pointed out that there is no way to find the actually tracked trees at the moment so we though a simple location link that opens up Google Maps would be enough for now. This is very simple. This is roughly what it should look like...
https://www.google.com/maps/dir//-6.4349354,38.2180494

Details:
IE 11, Yandex

See below the two images. Second icon should open the users map to quickly see the overview. (such as https://treetracker.org/?userid=3336)
Changing the order of icons first the pin icon with link to individual_tree, then the user_info_icon and then the user_map_icon

XML Parsing Error: not well-formed
Location: https://treetracker-map-features.fra1.digitaloceanspaces.com/freetown_catchments.geojson

Details:
Firefox browser

timeline icon should not show when side panel is open
timeline icon should never show when viewing a single tree link (like ?treeid=12312 or ?tree_name=test-name)

When rerender the map (by sliding the timeline) , can not cancel previous loading tile image and utf grid.

The start and end dates overlay if too close.

Show the timeline icon for case: https://map.treetracker.org/?userid=1
And be able to slide the timeline to filter the tree by date, for the current userid/planter.

Like:

• freetown
• wallet

Timeline icon is hard to spot on page load. This functionality should be more visible to the user. Maybe this was already fixed by our DEVs but listing it just to be sure. Feel free to close if not valid anymore.

Details: