Published
Edited
Aug 4, 2021
2 forks
7 stars
Hello, A5Chandrupatla’s root-finding methodSidi’s root-finding methodRegular numbersDruidJS workerNatural breaksDistance to a segmentRay out of a convex hullWord Tour: 40k words and their friendsHello, @thi.ng/grid-iteratorsHead/tail breaksPseudo-blue noise shaderHow fast does walk-on-spheres converge?AoC 12: shortest path under constraintsKDE estimationPlot: Correlation heatmapPoisson Finish 2Poisson disk sampling functionsWoS with transportSimple and surprising sortLocal medianTime series topological subsamplingUnion-FindLevel set experiment 1Mean value coordinatesPoisson potentialMiddle-squareWorld of squares (spherical)World of squaresLargest Inscribed Square
Hello, PyWavelets
Geothmetic meandianHello, Reorder.jsGeometric MedianImage FFTTransport to a mapDisc TransportTP3: Power Diagram and Semi-Discrete Optimal TransportThe blue waveHello, genetic-jsSliced Optimal TransportDruidJSSelf-Organizing Maps meet DelaunayHello, polygon-clippingseedrandom, minimalWalk on Spheres 2Walk on SpheresHello, AutoencoderKaprekar’s numberVoronoiMap2DHello, ccwt.jsPolygon TriangulationQuantile.invert?Linear congruential generatorHue blurNeedle in a haystackMoving average blurApollo 11 implementation of trigonometric functions, by Margaret H. Hamilton (march 1969)2D curves intersectionThe 2D approximate Newton-Raphson methodInverting Lee’s Tetrahedral projectionLinde–Buzo–Gray stipplingMean shift clustering with kd-tree2D point distributionsShortest pathKahan SummationHello, delatinDijkstra’s algorithm in gpu.jsLloyd’s relaxation on a graphManhattan DiameterManhattan VoronoiMobility landscapes — an introductionDijkstra’s shortest-path treeH3 odditiesProtein MatrixConvex Spectral WeightsSort stuff by similarityKrigingDelaunay.findTrianglen-dimensions binning?Travelling with a self-organizing mapUMAP-o-MaticMNIST & UMAP-jsHello UMAP-jsMean shift clusteringLevenshtein transitionRd quasi-random sequencesAutomated label placement (countries)Phyllotaxis explainedMotionrugsPlanar hull (Andrew’s monotone chain algorithm)South Africa’s medial axisTravelling salesperson approximation with t-SNEDistance to shoreWorkerngraph: pagerank, louvain…t-SNE VoronoiCloud ContoursCircular function drawingKruskal MazeMyceliumTravelling salesperson approximation on the globe, with t-SNEtsne.jstsne.js & worker
Also listed in…
Image
Hello
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
image = FileAttachment("camera.png").image()
Insert cell
coeffs = py`
# Wavelet transform of image
import numpy as np
import pywt
import pywt.data

pywt.dwt2(${pixels}, ${waveletType})
`
Insert cell
wvTypes = py`
import pywt
[pywt.wavelist(family) for family in pywt.families()]
`
Insert cell
display = (coeffs) => py`
########################################### patch matplotlib for Observable #######
## taken from "@gnestor/pyodide-demo"
from matplotlib import pyplot as plt
import types
import io
import base64
from js import document
def _show(self):
buf = io.BytesIO()
self.savefig(buf, format='png')
buf.seek(0)
img_str = 'data:image/png;base64,' + base64.b64encode(buf.read()).decode('UTF-8')
el = document.createElement('img')
el.src = img_str
return el
plt._show = types.MethodType(plt.show, plt)
plt.show = types.MethodType(_show, plt)
####################################################################################

LL, (LH, HL, HH) = ${coeffs}

# Plot approximation and details
titles = ['Approximation', ' Horizontal detail',
'Vertical detail', 'Diagonal detail']
fig = plt.figure(figsize=(12, 3))
for i, a in enumerate([LL, LH, HL, HH]):
ax = fig.add_subplot(1, 4, i + 1)
ax.imshow(a, interpolation="nearest", cmap=plt.cm.gray)
ax.set_title(titles[i], fontsize=10)
ax.set_xticks([])
ax.set_yticks([])

fig.tight_layout()

plt.show()
`
Insert cell
import { py, pyodide } from "@gnestor/pyodide"
Insert cell
pixels = {
const w = image.naturalWidth;
const h = image.naturalHeight;
const context = DOM.context2d(w, h, 1);
context.drawImage(image, 0, 0);
const { data } = context.getImageData(0, 0, w, h);
const pixels = [];
for (let y = 0; y < h; y++)
pixels.push(
Uint8Array.from({ length: w }, (_, x) =>
gray(data.slice(4 * (x + w * y), 4 * (x + w * y + 1)))
)
);

return pixels;
}
Insert cell
// Adobe Photoshop RGB (1998); proper grayscale conversion
function gray([r, g, b]) {
const gamma = 2.2;
return (
(r ** gamma * 0.2973 + g ** gamma * 0.6274 + b ** gamma * 0.0753) **
(1 / gamma)
);
}
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more