Skip to content

Instantly share code, notes, and snippets.

View tristen's full-sized avatar

Tristen Brown tristen

314 followers · 27 following
View GitHub Profile
@bddicken
bddicken / Contour.html
Last active November 27, 2024 14:52
Contour Images
<html>
<head>
<script is:inline defer src="https://cdn.jsdelivr.net/npm/img-comparison-slider@8/dist/index.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/img-comparison-slider@8/dist/styles.css" />
<style>
.slider {
width: 70%;
@chriswhong
chriswhong / RadiusMode.js
Created March 1, 2018 12:04
RadiusMode, a custom mode for mapbox-gl-draw for drawing a radius
// custom mapbopx-gl-draw mode that modifies draw_line_string
// shows a center point, radius line, and circle polygon while drawing
// forces draw.create on creation of second vertex
import MapboxDraw from 'mapbox-gl-draw';
import numeral from 'numeral';
import lineDistance from 'npm:@turf/line-distance';
const RadiusMode = MapboxDraw.modes.draw_line_string;
@mathisonian
mathisonian / index.md
Last active August 10, 2024 20:59
requiring npm modules in the browser console

demo gif

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details: mathisonian/requirify#5

inspiration

@ryantroyford
ryantroyford / engine-displacement.md
Last active August 29, 2015 14:05
there's no replacement for displacement!

yo heather! very cool that you're looking into a scooter. i can guarantee a good time. anyway, to the point:

displacement

(disclaimer: I DON'T MEAN TO SOUND LIKE A MANSPLAINING D-BAG, so if i do, i'm sorry, i just get excited about this shit and want to pass on what i know)

displacement is the volume of gas moved by all the cylinders in an internal combustion engine. you've seen these:

piston

@mapmeld
mapmeld / mapboxgl.md
Last active March 4, 2019 15:12
Getting Started with MapBoxGL

Getting Started

I recently made my first map with MapBox's new WebGL+JavaScript API. There aren't many examples of how to do this yet, even on MapBox's API page, so I'll document my own experience here.

The Van Gogh Map

My map is made of several textures taken from Van Gogh paintings. The long-term goal is to allow a user to select which artworks they want to take textures from, but for now there is just one setting.

Why are we changing maps?

@jcdickinson
jcdickinson / colorblind.glsl
Last active April 28, 2024 23:27
Colorblind Simulation Shader
/*-----------------------------------------------------------.
/ ColorBlind correction /
'-----------------------------------------------------------*/
// Daltonize (source http://www.daltonize.org/search/label/Daltonize)
// Modified to simulate color blindness.
float4 Daltonize( float4 input, float2 tex )
{
// RGB to LMS matrix conversion
float3 L = (17.8824f * input.r) + (43.5161f * input.g) + (4.11935f * input.b);
float3 M = (3.45565f * input.r) + (27.1554f * input.g) + (3.86714f * input.b);
@kaishin
kaishin / NSColor+isLight.h
Last active October 14, 2022 01:09
Programmatically determine the perceived lightness of a color. More details on: http://robots.thoughtbot.com/closer-look-color-lightness + Online tool: http://thoughtbot.github.io/color-lightness-test/
#import <Cocoa/Cocoa.h>
@interface NSColor (isLight)
- (BOOL)isLight;
@end
@remy
remy / batcharge.py
Last active November 14, 2024 03:37
My zsh set up as of July 25, 2013
#!/usr/bin/env python
# saved to ~/bin/batcharge.py and from
# http://stevelosh.com/blog/2010/02/my-extravagant-zsh-prompt/#my-right-prompt-battery-capacity
#!/usr/bin/env python
# coding=UTF-8
import math, subprocess
p = subprocess.Popen(["ioreg", "-rc", "AppleSmartBattery"], stdout=subprocess.PIPE)
output = p.communicate()[0]
@lgiraudel
lgiraudel / optimize.sh
Last active October 30, 2024 10:57
Optimize image script. cf http://hugogiraudel.com/2013/07/29/optimizing-with-bash/
#!/bin/bash
PROGNAME=${0##*/}
INPUT=''
QUIET='0'
NOSTATS='0'
max_input_size=0
max_output_size=0
usage()
@tmcw
tmcw / d3.md
Last active December 6, 2022 14:04
Accompaniment to dcjq

This is a more wordy, narrative accompaniment to my pretty bare presentation about d3 that I gave to the jQuery DC Meetup.

What is d3?

  • Not a chart library (though you can make charts with it)
  • Not a map library (though you can make maps with it)

Which is to say, d3 can be used for building things, but the 'atomic parts' are lower-level than bar graphs or projections or so on. This is a powerful fact. It also means that d3 is a good basis for simple interfaces, like Vega.js, that make its power accessible in other ways.

  • Not a compatibility layer (it doesn't work with bad browsers)