orcasound / orcamap-react Goto Github PK

Is your feature request related to a problem? Please describe.

When we have information about the direction a marine animal (e.g. orca) is moving, we don't currently visualize it on the map.

Describe the solution you'd like

One possible solution is to follow the lead of the Canadian spyhopper.ca site. They rotate a side-view orca icon to indicate the direction of movement. Here is a screengrab from today:

Describe alternatives you've considered

Other ideas:

• Display animal locations as vectors (arrow icons) rotated to indicate direction of movement at each location
• Group sequential locations using a tag (e.g. "J pod" or an individual ID), then compute direction between points and display as a vector (e.g. underneath an animal icon), or as a line connecting points
• Visualize both any observed direction and computed direction estimates

In general we should use or improve on what is being used in the orcasite repo

some ideas:

• xstate
• material-ui
• styled-components?

As a community scientist looking or listening for orcas (SRKWs) in real time,
if given a real time location or track (e.g. from the Acartia data cooperative),
I want a visualization on the Orcamap of where a pod or matriline or individual is likely to go in the next few hours.

Describe the solution you'd like

One solution would be to incorporate a published movement model for SRKWs, e.g. Marine Randon's effort to forecast SRKW movement. More background on Marine's postdoc is here, including a poster and peer-reviewed publication. Another model may have been developed (but not yet published?) by Rich Osborne and a colleague at the University of Washington.

Describe alternatives you've considered

A simpler, useful step forward might be to expand a circle around the last observation at a rate that's proportional to the traveling speed of SRKWs (~6km/hr).

Another approach could be to generate SRKW tracks from historic observations (some of which may not have been included in the development of the above models) and take a different approach to generate a supplementary or competing model.

Additional context

A tricky part may be routing the SRKW trajectory so that it does not cross land or waters shallower than a few meters, or enter embayments where SRKWs are rarely or never observed...

Problem description:

When orcas are heard and their coordinates are mapped on the google sheets and then on the google sheets vector layer then the hydrophone around that coordinate should light up

@ivanoats would like to know more about this problem statement and then work out a solution for this that would include a light up hydrophone svg/icon/photo whenever the coordinates of hearing are mapped

on running npm start after installing packages by npm install it shows error :

node:internal/modules/cjs/loader:922
throw err;
^

Error: Cannot find module 'regjsparser'
i had commited it at #36

• node version: v14.16.0
• npm (or yarn) version: 7.7.0

Problem description:
Currently package-lock uses lockfile version 1.0

If two different developers are using different versions of node (12/15) & npm (6/7) in a project that was originally created using a package-lock.json "lockfileVersion": 1, when the developer using npm 7x installs new packages it seems that the package-lock.json is re-created using "lockfileVersion": 2. please see issue

This seems to cause issues for the developer using npm v6, as it tries to work with the lockfileVersion 2, but it ends up producing new diffs.

Suggested solution:
Npm currently suggests
1: The lockfile version-1 used by npm v5 and v6.
2: The lockfile version-2 used by npm v7, which is backwards compatible to v1 lockfiles.
3: The lockfile version-3 used by npm v7, without backwards compatibility affordances. This is used for the hidden lockfile at node_modules/.package-lock.json, and will likely be used in a future version of npm, once support for npm v6 is no longer relevant.

Thus bumping to lockfile version-2 seems to be usable viable option. Ive also faced issues of large diffs upto 30k changes in lockfile as evident in #35 #28 .
Locking to version-1 is also a solution but isn't the best approach IMO and thus we can easily port to version2.0 which is backwards compatible and also supports future versions. see official docs

MIT? GPL? aGPL?

Describe the solution you'd like

I would like to add a + and - and reset component to the map which would help in scaling up, down the zoom and reset the zoom of the vector layer.

Minimum and Maximum zoom limit would be set to avoid negative or low values of zoom

Problem description:

The Present PR template is a bit less descriptive. As we move forward, it would be better if we have spaces for screenshots in desktop view and mobile view for the web app and also have more code checks like responsiveness or utility

@ivanoats would like to work on this issue as well

#45 PR will close the issue

We should consider moving from a Create-React-App base to NextJS

1. more of a production grade system
2. API route and SSG capabilities
3. better experience builder for resumes for bootcampers / GSoC students

Docs: https://nextjs.org/docs/migrating/from-create-react-app

What do you think? Add this to the Roadmap? (#23)

Roadmap
For March and the next few months 2021

• Make vector layer for google sheets

• Connect google sheets info in useEffect() in mapContainer

• Deploys in prod, stage, and PR previews on Netlify working

• Make separate vector layer with hydrophone coordinates and image

Hello Mentors
I am new to this project and recently set up on my local machine
Can anyone tell where can I get the googlesheet data source api key. I had to raise the issue because I was not able to find any slack / discord link
I would love to contribute in this project
Thank You
Kunal

Issue

• The current site isn't responsive on smaller devices (see screenshot)
  

Solution

• fixing css

Fixing responsive issues early on would make development easier as one would be able check if the site remains responsive after newer changes and it's also easier to fix this now than in the future.

also after that it fails to compile
shows error:
Failed to compile.

src\App.tsx
Line 1:26: Delete ␍ prettier/prettier
Line 2:66: Delete ␍ prettier/prettier
Line 3:1: Delete ␍ prettier/prettier
Line 4:30: Replace s␍ with ⏎··s prettier/prettier
Line 5:11: Delete ␍ prettier/prettier
Line 6:26: Delete ␍ prettier/prettier
Line 7:67: Delete ␍ prettier/prettier
Line 8:23: Delete ␍ prettier/prettier
Line 9:11: Delete ␍ prettier/prettier
Line 10:4: Delete ␍ prettier/prettier
Line 11:2: Delete ␍ prettier/prettier
Line 12:1: Delete ␍ prettier/prettier
Line 13:19: Delete ␍ prettier/prettier

src\components\MapContainer\Controls\Controls.tsx
Line 1:26: Delete ␍ prettier/prettier

for every line in every file
i fixed it at #38

Is your feature request related to a problem? Please describe.

Presently, the marker(marked by the hydrophone image) looks like thus below in the map and is not interactive or does not display much data

Describe the solution you'd like

A component like the below one could be implemented to perform this change and improvise
//
(except that the pause component could be replaced by a better hydrophone component to ensure that the lighting up functionality is not hampered)
//

Additional context

@ivanoats If this can be proceeded with then please assign this issue so that I can work on this.

• eslint runs prettier

• css standard?

• functional components and hooks over class based components

• types if possible

• anything else? comments and questions?

Is your feature request related to a problem? Please describe.

When we realize a Southern Resident killer whale (SRKW) is in nutritional distress (starving, peanut head) based on e.g. drone-based photogrammetry or other imagery of body condition, it is sometimes too late to intervene and have vets try to save the animal (e.g. J50 with parasite load). Rob Williams suggested in his 2/6/24 Salish Sea round table talk that swim speed or reduced dive duration of an individual might be an early precursor to poor body condition.

Could such metrics emerge from Acartia.io data -- either for the distressed individual's pod or matriline -- or even for the individual if enough photo IDs are obtained to define a track for them?

Describe the solution you'd like

For a visualized track of SRKW locations from Acartia.io, compute and display speed statistics. For example, hovering over a track's label (e.g. start or end icon?), the UI could show the mean and standard deviation of the speed for over the entire track. If individual track segments were hovered over, then the speed (and direction?) between the adjacent points could be displayed.

For a given region and/or time period, perhaps speed statistics for a suite of tracks could be visualized? Ideally, we'd be able to monitor the swim speed of each SRKW individual and detect any anomalously low swim speeds in near real time... (which would trigger an emergency notification!)

The buttons allowing the user to pull from google sheets, refresh markers, clear new markers etc haven't been added to the map yet.

Describe the solution you'd like

Currently orcamap support markers but doesn't provide any further information regarding the points
for example current marker icon adds hydropin image over specifed positions:

Expected Solution
Rendering custom component as pop-up on these markers.
Intention to add location name, co-ordinates, hrefs in a styled manner.
So that user on interacting with each location can get further information about these points.