SVG – Matthew Petroff https://mpetroff.net mpetroff.net Sun, 05 Jul 2020 23:57:02 +0000 en-US hourly 1 HTML5 Night Sky Viewer https://mpetroff.net/2014/02/html5-night-sky-viewer/ https://mpetroff.net/2014/02/html5-night-sky-viewer/#comments Sun, 09 Feb 2014 23:41:29 +0000 http://www.mpetroff.net/?p=1292 Continue reading →]]> For HopHacks last weekend, I wrote an HTML5 night sky viewer. Using D3.js and SunCalc, the 750 brightest stars are rendered using SVG and Javascript. One’s location can either be found using the HTML5 Geolocation API, or it can be entered manually. The keyboard is used to navigate, and mousing over a star will display some information about it. As it was written in a weekend, there may be bugs.

Here is the viewer:
https://mpetroff.net/files/nightsky/

The code is available on Github.

Night Sky

]]> https://mpetroff.net/2014/02/html5-night-sky-viewer/feed/ 1 Camp Workcoeman Website Redesign https://mpetroff.net/2014/01/camp-workcoeman-website-redesign/ https://mpetroff.net/2014/01/camp-workcoeman-website-redesign/#comments Tue, 21 Jan 2014 00:04:26 +0000 http://www.mpetroff.net/?p=1277 Continue reading →]]> I spent the last few weeks redesigning the Camp Workcoeman website. The site design is based on Bootstrap, without the jQuery components, and makes heavy use of SVGs. In addition, the header dynamically responds to the time of day—the sun’s out during the day, and the stars are out at night. Using SunCalc.js, it fairly accurately displays the sun and moon. Jekyll is used for templating and site generation.

New Site

Compare this to the old site, which was completely static HTML and Flash, making updates difficult.

Old Site

]]> https://mpetroff.net/2014/01/camp-workcoeman-website-redesign/feed/ 2