I'm a professor of mathematics at the University of North Carolina Asheville. I've also done a fair amount of consulting work over the years focusing on scientific and data visualization.
I'm happy to be part of the first Observable Ambassador's cohort.
Published
Edited
Jun 15, 2022
1 star
pringle = {
let w = width < 800 ? width : 800;
let h = 0.6 * w;
let container = d3
.create("div")
.style("width", w.toString() + "px")
.style("height", h.toString() + "px");
let scene = container
.append("x3d")
.attr("width", w.toString() + "px")
.attr("height", h.toString() + "px")
.append("scene");
scene
.append("viewpoint")
.attr("position", "0.41776 -3.10183 1.25741")
.attr("orientation", "0.99632 0.04925 0.07010 1.16242");
let quads = [];
let color_string = "";
let dr = 0.05;
let N = 32;
let dt = (2 * Math.PI) / (2 * N);
for (let r = 0; r < 1 - dr; r = r + dr) {
for (let t = 0; t < 2 * Math.PI - dt / 2; t = t + dt) {
quads.push([
[r * Math.cos(t), r * Math.sin(t), u(r, t)],
[(r + dr) * Math.cos(t), (r + dr) * Math.sin(t), u(r + dr, t)],
[
(r + dr) * Math.cos(t + dt),
(r + dr) * Math.sin(t + dt),
u(r + dr, t + dt)
],
[r * Math.cos(t + dt), r * Math.sin(t + dt), u(r, t + dt)]
]);
let c1 = rgb_to_r_g_b(d3.interpolateRdBu((1 - u(r, t)) / 2));
let c2 = rgb_to_r_g_b(d3.interpolateRdBu((1 - u(r + dr, t)) / 2));
let c3 = rgb_to_r_g_b(d3.interpolateRdBu((1 - u(r + dr, t + dt)) / 2));
let c4 = rgb_to_r_g_b(d3.interpolateRdBu((1 - u(r, t + dt)) / 2));
color_string =
color_string + c1 + ", " + c2 + ", " + c3 + ", " + c4 + ", ";
}
}
let radial_lines = [];
for (let r = 0; r < 1 - dr; r = r + dr) {
for (let t = 0; t < 2 * Math.PI - dt / 2; t = t + 8 * dt) {
radial_lines.push([
[r * Math.cos(t), r * Math.sin(t), u(r, t)],
[(r + dr) * Math.cos(t), (r + dr) * Math.sin(t), u(r + dr, t)]
]);
}
}
let circular_lines = [];
for (let t = 0; t < 2 * Math.PI - dt / 2; t = t + dt) {
for (let r = 0; r < 1 - dr; r = r + 5 * dr) {
circular_lines.push([
[r * Math.cos(t), r * Math.sin(t), u(r, t)],
[r * Math.cos(t + dt), r * Math.sin(t + dt), u(r, t + dt)]
]);
}
}
let T = scene.append("transform");
T.append(
() =>
create_indexedFaceSet(quads, {
//color: '0.19 0.79 0.84'
color_string: color_string
}) //.node()
);
T.append(() => create_indexedLineSet(radial_lines));
T.append(() => create_indexedLineSet(circular_lines));
yield container.node();
x3dom.reload();
}
P = (r, theta) =>
(1 - r ** 2) / (1 + r ** 2 - 2 * r * Math.cos(theta)) / (2 * Math.PI)
f = theta => Math.sin(n * theta)
function u(r, theta) {
if (r == 1) {
return Math.sin(2 * theta);
} else {
return integrate(phi => f(phi) * P(r, phi - theta), -Math.PI, Math.PI);
}
}
// function u(r, theta) {
// if (r == 1) {
// return Math.sin(2 * theta);
// } else {
// return integrate(
// phi =>
// (f(phi) * (1 - r ** 2)) /
// (1 + r ** 2 - 2 * r * Math.cos(theta - phi)) /
// (2 * Math.PI),
// -Math.PI,
// Math.PI
// );
// }
// }
function rgb_to_r_g_b(rgb_string) {
return String(
rgb_string
.split('(')[1]
.split(')')[0]
.split(',')
.map(x => String(parseFloat(x) / 255))
).replace(/,/g, ' ');
}
function integrate(ff, a, b) {
return adaptiveSimpson(ff, a, b, {
tolerance: 1e-11,
maxDepth: 8,
minDepth: 7
});
}
import {
create_indexedLineSet,
create_indexedFaceSet
} from "@mcmcclur/x3dom-primitives"
x3dom = require('x3dom').catch(() => window['x3dom'])
import { adaptiveSimpson } from '@rreusser/integration@3056'
import { Range, Radio } from '@observablehq/inputs'
import { funplot } from '@mbostock/funplot'
d3 = require('d3@6')
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.
