patricksurry

## README.md

      
              3 files
            
          
              1 fork
            
          
              0 comments
            
          
              13 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              January 7, 2024 08:05
            
              
                Imitate hand-drawn (imperfect) circles using cubic Bézier segments
              
          
    Imitate hand-drawn (imperfect) circles using cubic Bézier segments,
based on a Bézier approximation to a perfect circle.
TLDR: a good approximation to a quarter circle of unit radius is a cubic Bézier curve with control points
P₀ = (0,1), P₁ = (c,1), P₂ = (1,c), P₃ = (1,0) where c = 0.551915024494.
By varying the points in a sensible way, we can do a good impression of hand-drawn circles.

  
## softclip.ipynb

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              2 stars
            
          
                patricksurry
                / softclip.ipynb
            
            
              Last active
              August 14, 2023 06:53
            
              
                softclip-notebook
              
          
        Loading

      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
      
    
## README.md

      
              9 files
            
          
              1 fork
            
          
              0 comments
            
          
              4 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              June 20, 2023 14:29
            
              
                D3 + simpleheat.js geographic heatmap
              
          
    Illustrates how to use Vladimir Agafonkin's clever simpleheat
JS library to overlay a heatmap of Hopper search destinations on a D3 map.
Just for fun we use a separate svg layer 'under' the canvas to display the map, although it's easy enough to have
D3 render direct to the canvas.  The default canvas (and svg) 'background' is transparent so we can see through layers,
making it easy to build up (say) an animated heatmap over a static map without continually redrawing the latter.

  
## README.md

      
              3 files
            
          
              5 forks
            
          
              0 comments
            
          
              1 star
            
          
                patricksurry
                / README.md
            
            
              Last active
              June 17, 2023 22:04
            
              
                Hex cube animation
              
          
    Hex cube visualization

Sadly the original bl.ocks.org seems to be dead.  Hopefully you can still see the visualization at this clone.
Inspired by Amit Patel's diagram illustrating cube coordinates. That diagram initially confused me because the edges of the grid cubes centered on integer coordinates in the plane x + y + z = 0 don't themselves lie in the plane, so it seemed like the animation "cheated" at the end by dissolving to planar hexagons.  But of course the point is just that the silhouettes of those cubes form a perfect hexagonal tiling of the plane.  That tiling is highlighted as red hexagons here.
I made this animation to get a better intuition for how those cubes intersect the zero plane. It shows what happens as we slice the cubes at x + y + z = w while reducing w towards 0. Fittingly the slice where the zero plane intersects each cube is in fac

  
## README.md

      
              3 files
            
          
              5 forks
            
          
              3 comments
            
          
              9 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              June 17, 2023 09:48
                — forked from mbostock/README.md
            
              
                D3JS quadtree nearest neighbor algorithm
              
          
    This example adapts mbostock's
quadtree brushing demo
to find the nearest neighbor (shown red) of a new point (shown yellow).
Choose a new point to classify by clicking on the diagram.
(An alternative approach for nearest neighbors of the mouse position is D3's
Voronoi polygons,
but the idea here would extend to rapidly classifying many new points against a
base collection of points.)
We use a data-dependent order of recursion through the quadtree

  
## README.md

      
              5 files
            
          
              3 forks
            
          
              2 comments
            
          
              0 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              March 28, 2023 23:31
                — forked from dwtkns/README.md
            
              
                Flying arcs with height proportional to length
              
          
    Adapted from this,
to avoid the second projection and make flying arc height proportional to length.
Because the 'sky' projection is just a scaled up version of the original one,
the projection of a sky point in canvas coords can be easily calculated by scaling
the ground projection point along the vector from the origin.
Another improvement(?) might be to avoid the swoosh/interpolate function by doing
this same trick directly on the stream of points that comes from the normal projection path
function.

  
## README.md

      
              4 files
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              February 27, 2023 11:11
            
              
                Flowsnake visualization of structural protein sequence for covid19 
              
          
    Illustration of how to convert from traditional axial (or cubical) hex coordinates to and from two one-dimensional
enumerations based on space-filling fractal curves.
The spiral honeycomb mosaic enumeration recursively labels nested "super hexes" in base 7, starting from 0 at the origin.
The flowsnake enumeration also call "Gosper7" here, recursively labels the same super hexes but in a continuous
sequence with no jumps.

This uses a negative base 7 with an unbalanced signed representation using the digits = (-2), - (-1), 0, 1, 2, 3, and 4.
These enumerations could be useful for compact visualization of one-dimensional sequence data
as well indexing hexagonal data storage with good locality properties similar to the Hilbert curve.
This example shows a simple visualization of the structural protein sequence for covid-19,

  
## index.html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap" rel="stylesheet">

    <style>
body {

## README.md

      
              3 files
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                patricksurry
                / README.md
            
            
              Last active
              March 1, 2022 05:15
            
              
                Omega Speedmaster demo built with G3
              
          
    Omega Speedmaster demo built with G3

  
## .block
license: mit
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap" rel="stylesheet">

	<style>
	body {