Let’s define line segment \(l\) and ray \(r\) as follows: $$ l: a + u\vec{s},\space\space r: o + t\vec{d} $$ where $$ \vec{s} = b - a,\space\space 0\le u \le 1,\space\space 0 \le t $$ Define $$ \vec{s{\prime}} = (s_y, -s_x),\space\space \vec{d{\prime}} = (d_y, -d_x) $$ \(s . s{\prime} = 0\). This geometric perpendicularity allows for nice algebric cancellations next. Dot product is commutative and is distributive over vector addition. We find \(t\): $$ a + u\vec{s} = o + t\vec{d} $$ $$ (a + u\vec{s}) .
Calculating far plane distance in Mapbox gl-js
Background In my previous post I left out a few things when talking about tranformations. This post is a follow-up on how the camera far plane in Mapbox gl-js is calculated. Correctly computing the far plane distance ensures that everything is rendered/culled properly (in particular in tilted view). Let’s far plane The far plane is affected by the camera’s field of view, its pitch and its altitude, \(r\) (which we already covered in the previous post).
An analytical solution to the integral of cos^2(theta) over a spherical surface
Background In his book 3 in the fantastic series Raytracing in a weekend Peter Shirley computes an integral numerically and leaves the analytical solution as an exercise. This analytical proof is presented below. Proof Putting everything down formally, this is what we’re tryign to compute: $$ \iint_{\Omega} f dS $$ The integrand is a function in spherical coordinates, that is \(f(r, \theta, \phi) = \cos^2(\theta) \). Domain of integration is denoted by \(\Omega\) which is the surface of a unit sphere.
A trip down the transformation pipeline in Mapbox GL-JS
In this article I will briefly explain how GL-JS renders an encoded point from a vector tile onto the screen. Few notes I assume you already know what vector tiles are so here are few things to know about Mapbox vector tiles: They are agnostic of geographics information. Mapbox vector tiles have a resolution of 512 pixels. They are efficiently encoded (using google protobufs) for fast transfer over web. Let’s go!