joergdietrich / leaflet.terminator Goto Github PK
View Code? Open in Web Editor NEWNight and day regions on Earth
License: MIT License
Night and day regions on Earth
License: MIT License
Please update your wonderful javascript using the calculation of the terminator that includes an averaged atmoshpheric refraction addition: that I (chaim) explained how to calculated in the following post:
http://physics.stackexchange.com/questions/28563/hours-of-light-per-day-based-on-latitude-longitude-formula/320092#320092
The calculation manner is as following. After calculating the percentage of dayligh for any latitude, calculate the longitude of noon for any time, and the day night terminator at that latitude will be a half of the percentage of daylight in angle on either direction of the noon position. Thank you!
How could I append another terminator line for a golden hour (Sun 6 deg above the horizon), twilight (optionally 6,12,18 degrees below the horizon), Moon, Venus, Jupiter, and other planets?
Is it fairly possible?
By default, when hovering the mouse over the terminator overlay, the mouse cursor changes to the clickable pointer. This provides a poor user experience: it gives a misleading and distracting visual cue that the dark area would be something to interact with, and it also deprives from the proper visual cue of the cursor changing to clickable when hovering over an actually clickable marker on the dark side.
This can be fixed by passing interactive: false
in the constructor options: "If false, the layer will not emit mouse events and will act as a part of the underlying map." (https://leafletjs.com/reference-1.6.0.html#polygon-interactive) I'm not fully sure of all the effects, but I would suggest adding this to the default Terminator options (where it can still be overridden), or at least documenting it in the README (and at least it's documented in this issue now).
Hi,
I'm having problems while displaying the terminator.
This is totally black on the dark-side and I cannot see anything in this part.
These are my options:
options: {
color: '#00',
weight: 2,
opacity: 0.5,
fillColor: '#00',
fillOpacity: 0.5,
resolution: 2
},
Any suggestion?
Since you're using raw.github.com
for Javascript resources, Chromium refuses to execute it.
You could use http://rawgithub.com instead, or git submodule
to fix the problem.
Good luck ;)
Have you though of extending the Leaflet.Terminator to work with react-leaflet, a react-leaflet-terminator if you will. The code would be a wrapper for Leaflet.Terminator so you could add it to your map like so
thoughts?
Great plugin! I just tested it though, and it seems not to wrap if the map is zoomed all the way out, even if worldCopyJump is set to true (http://leafletjs.com/reference.html#map-options).
Is the current width of the polygon a workaround? It seems to cover about 2 earth circumferences.
Hi!
Do you plan to publish a bower component ?
Thanks!
It is a great plugin! I have used it for a program for a few months, it work fines. But started from yesterday, I found the the terminator curve suddenly not in bell shape and become straight rectangle shapes.
Please refer to the attached screen below, which I saw it now (Tuesday, 23 September
9:05:55 a.m(GMT + 0:00))
Is there is an issue for the datetime calculation for the polygon? Which datetime will trigger this issue? May you please hlep on that? Thank you.
Hi,
This plugin is great, thank you for your job. I have a question. I would like refresh automatically every five minutes the Terminator layer. How can I do this? I thank you for your help!
Best,
Zsolt
Hello!
Thank you very much for this handy library! I was wondering about a feature request that I think would be a useful addition. I have a dark map so using a dark overlay make the map even darker and is hard to distinguish the terminator. I would much rather visualize the light/day side with a white overlay.
How hard would it be to calculate the "inverse" Polygon? Could this possible be added?
It would be cute to have an option for a yellow dot that shows the current overhead position of the sun.
Calling setTime()
refreshes the terminator to the current time. It would be nice if this could work out of the box with no additional client code.
There is always the setInterval()
trick, but it's not necessarily a good design to add background timers that will suck out CPU cycles even when the page is inactive.
I've migrated from Google Maps and the day/night overlay at https://github.com/marmat/google-maps-api-addons This implementation refreshes the overlay automatically to the current time, upon interaction with the map - although it might be more of an incidental result due to the use of the built-in google.maps.OverlayView class. I felt pretty good about that behavior.
To replicate this, I use a snippet like:
var terminator = L.terminator();
map.addEventListener('zoomstart movestart popupopen', function(e) {
terminator.setTime();
});
terminator.addTo(map);
It's also possible to trigger refreshing more thoroughly on additional map interaction events, like for example 'baselayerchange' or the somewhat enigmatic 'viewreset' (https://leafletjs.com/reference-1.6.0.html#map-event).
It would be nice if either or both of these automatic refreshing mechanisms could be available and provided by the library, if not enabled by default - maybe also controlled by an option; or at least documented further by putting code samples in the README.
PR #4 created a new setTime()
method. This should be documented on the webpage: http://joergdietrich.github.io/Leaflet.Terminator/
Hey guys.
This plugin is great. But I can't figure out how to remove the overlay from the map after adding it.
I tried terminator().remove() but it didn't work. May be I did wrong.
Please advice! thx.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.