shallow water equations solver
This commit is contained in:
@@ -16,3 +16,6 @@ sbp = { path = "../sbp", features = ["f32"] }
|
||||
ndarray = "0.13.0"
|
||||
euler = { path = "../euler" }
|
||||
maxwell = { path = "../maxwell" }
|
||||
shallow-water = { path = "../shallow_water" }
|
||||
console_log = "0.2.0"
|
||||
log = "0.4.8"
|
||||
|
||||
@@ -13,6 +13,14 @@ pub fn set_panic_hook() {
|
||||
console_error_panic_hook::set_once();
|
||||
}
|
||||
|
||||
#[wasm_bindgen]
|
||||
pub fn set_console_logger() {
|
||||
use std::sync::Once;
|
||||
static LOG_INIT: Once = Once::new();
|
||||
|
||||
LOG_INIT.call_once(|| console_log::init_with_level(log::Level::Trace).unwrap());
|
||||
}
|
||||
|
||||
#[wasm_bindgen]
|
||||
pub struct MaxwellUniverse(maxwell::System<operators::Upwind4>);
|
||||
|
||||
@@ -119,3 +127,55 @@ fn start_and_advance_upwind_euler() {
|
||||
universe.advance_upwind(0.01);
|
||||
}
|
||||
}
|
||||
|
||||
#[wasm_bindgen]
|
||||
pub struct ShallowWaterUniverse(shallow_water::System);
|
||||
|
||||
#[wasm_bindgen]
|
||||
impl ShallowWaterUniverse {
|
||||
#[wasm_bindgen(constructor)]
|
||||
pub fn new(height: usize, width: usize) -> Self {
|
||||
let x = (0.0, 1.0, width);
|
||||
let y = (0.0, 1.0, height);
|
||||
Self(shallow_water::System::new(x, y))
|
||||
}
|
||||
|
||||
pub fn init(&mut self, x0: f32, y0: f32) {
|
||||
let nx = self.0.nx();
|
||||
let ny = self.0.ny();
|
||||
let x = ndarray::Array1::linspace(0.0, 1.0, nx);
|
||||
let y = ndarray::Array1::linspace(0.0, 1.0, ny);
|
||||
|
||||
let (mut eta, mut etau, mut etav) = self.0.components_mut();
|
||||
|
||||
let sigma = 0.1;
|
||||
|
||||
for j in 0..ny {
|
||||
for i in 0..nx {
|
||||
let r = f32::hypot(x[i] - x0, y[j] - y0);
|
||||
|
||||
let f = 1.0 / (sigma * (2.0 * sbp::consts::PI).sqrt())
|
||||
* f32::exp(-0.5 * (r / sigma).powi(2));
|
||||
eta[(j, i)] = 1.0 - 0.1 * f;
|
||||
etau[(j, i)] = eta[(j, i)] * 0.0;
|
||||
etav[(j, i)] = eta[(j, i)] * 0.0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pub fn advance(&mut self) {
|
||||
self.0.advance()
|
||||
}
|
||||
|
||||
pub fn get_eta_ptr(&self) -> *const u8 {
|
||||
self.0.eta().as_ptr() as *const u8
|
||||
}
|
||||
|
||||
pub fn get_etau_ptr(&self) -> *const u8 {
|
||||
self.0.etau().as_ptr() as *const u8
|
||||
}
|
||||
|
||||
pub fn get_etav_ptr(&self) -> *const u8 {
|
||||
self.0.etav().as_ptr() as *const u8
|
||||
}
|
||||
}
|
||||
|
||||
15
webfront/pages/shallowWater/index.html
Normal file
15
webfront/pages/shallowWater/index.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<!doctype html>
|
||||
<!--https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context-->
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="generator" content="by-hand" />
|
||||
<meta name="viewpost" context="width=device-width, inital-scale=1.0, user-scalable=yes" />
|
||||
<title>Shallow Water solver (ΣBP)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../style.css">
|
||||
<script async type="module" src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="glCanvas"></canvas>
|
||||
</body>
|
||||
</html>
|
||||
266
webfront/pages/shallowWater/main.js
Normal file
266
webfront/pages/shallowWater/main.js
Normal file
@@ -0,0 +1,266 @@
|
||||
import { ShallowWaterUniverse, default as init, set_panic_hook as setPanicHook, set_console_logger as setConsoleLogger } from "../sbp_web.js";
|
||||
|
||||
/**
|
||||
* Initialises and runs the Maxwell solver,
|
||||
* plotting the solution to a canvas using webgl
|
||||
*/
|
||||
(async function run() {
|
||||
const wasm = await init("../sbp_web_bg.wasm");
|
||||
setPanicHook();
|
||||
setConsoleLogger();
|
||||
|
||||
const canvas = document.getElementById("glCanvas");
|
||||
|
||||
const gl = canvas.getContext("webgl");
|
||||
if (gl === null) {
|
||||
console.error("Unable to initialise WebGL");
|
||||
return;
|
||||
}
|
||||
|
||||
const vsSource = String.raw`
|
||||
#version 100
|
||||
attribute mediump float aX;
|
||||
attribute mediump float aY;
|
||||
attribute mediump float aField;
|
||||
|
||||
uniform vec4 uBbox;
|
||||
|
||||
varying mediump float vField;
|
||||
|
||||
void main() {
|
||||
vField = aField;
|
||||
mediump float x = (aX - uBbox.x)*uBbox.y;
|
||||
mediump float y = (aY - uBbox.z)*uBbox.w;
|
||||
gl_Position = vec4(2.0*x - 1.0, 2.0*y - 1.0, 1.0, 1.0);
|
||||
}
|
||||
`;
|
||||
|
||||
const fsSource = String.raw`
|
||||
#version 100
|
||||
varying mediump float vField;
|
||||
|
||||
uniform int uChosenField;
|
||||
|
||||
void main() {
|
||||
mediump float r = 0.0;
|
||||
mediump float g = 0.0;
|
||||
mediump float b = 0.0;
|
||||
|
||||
if (uChosenField == 0) {
|
||||
r = 0.5*vField;
|
||||
} else if (uChosenField == 1) {
|
||||
g = (vField + 1.0)/2.0;
|
||||
} else {
|
||||
b = vField + 0.5;
|
||||
}
|
||||
gl_FragColor = vec4(r, g, b, 1.0);
|
||||
}
|
||||
`;
|
||||
|
||||
const vsShader = gl.createShader(gl.VERTEX_SHADER);
|
||||
gl.shaderSource(vsShader, vsSource);
|
||||
gl.compileShader(vsShader);
|
||||
if (!gl.getShaderParameter(vsShader, gl.COMPILE_STATUS)) {
|
||||
console.error(`Could not compile shader: ${gl.getShaderInfoLog(vsShader)}`);
|
||||
return;
|
||||
}
|
||||
|
||||
const fsShader = gl.createShader(gl.FRAGMENT_SHADER);
|
||||
gl.shaderSource(fsShader, fsSource);
|
||||
gl.compileShader(fsShader);
|
||||
if (!gl.getShaderParameter(fsShader, gl.COMPILE_STATUS)) {
|
||||
console.error(`Could not compile shader: ${gl.getShaderInfoLog(fsShader)}`);
|
||||
return;
|
||||
}
|
||||
|
||||
const shaderProgram = gl.createProgram();
|
||||
gl.attachShader(shaderProgram, vsShader);
|
||||
gl.attachShader(shaderProgram, fsShader);
|
||||
gl.linkProgram(shaderProgram);
|
||||
gl.validateProgram(shaderProgram);
|
||||
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
|
||||
console.error(`Unable to link shader program: ${gl.getProgramInfoLog(shaderProgram)}`);
|
||||
return;
|
||||
}
|
||||
gl.useProgram(shaderProgram);
|
||||
|
||||
// A nice pink to show missing values
|
||||
gl.clearColor(1.0, 0.753, 0.796, 1.0);
|
||||
gl.clearDepth(1.0);
|
||||
gl.enable(gl.DEPTH_TEST);
|
||||
gl.depthFunc(gl.LEQUAL);
|
||||
gl.disable(gl.CULL_FACE);
|
||||
|
||||
console.info("Successfully set OpenGL state");
|
||||
|
||||
|
||||
const width = 70;
|
||||
const height = 70;
|
||||
|
||||
|
||||
const x = new Float32Array(width * height);
|
||||
const y = new Float32Array(width * height);
|
||||
for (let j = 0; j < height; j += 1) {
|
||||
for (let i = 0; i < width; i += 1) {
|
||||
const n = width*j + i;
|
||||
x[n] = i / (width - 1.0);
|
||||
y[n] = j / (height - 1.0);
|
||||
}
|
||||
}
|
||||
|
||||
const universe = new ShallowWaterUniverse(height, width);
|
||||
|
||||
|
||||
// Transfer x, y to cpu, prepare fBuffer
|
||||
const xBuffer = gl.createBuffer();
|
||||
const yBuffer = gl.createBuffer();
|
||||
const fBuffer = gl.createBuffer();
|
||||
{
|
||||
const numcomp = 1;
|
||||
const type = gl.FLOAT;
|
||||
const normalise = false;
|
||||
const stride = 0;
|
||||
const offset = 0;
|
||||
|
||||
let loc = gl.getAttribLocation(shaderProgram, "aX");
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, xBuffer);
|
||||
gl.vertexAttribPointer(loc, numcomp, type, normalise, stride, offset);
|
||||
gl.enableVertexAttribArray(loc);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, x, gl.STATIC_DRAW);
|
||||
|
||||
loc = gl.getAttribLocation(shaderProgram, "aY");
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, yBuffer);
|
||||
gl.vertexAttribPointer(loc, numcomp, type, normalise, stride, offset);
|
||||
gl.enableVertexAttribArray(loc);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, y, gl.STATIC_DRAW);
|
||||
|
||||
loc = gl.getAttribLocation(shaderProgram, "aField");
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, fBuffer);
|
||||
gl.vertexAttribPointer(loc, numcomp, type, normalise, stride, offset);
|
||||
gl.enableVertexAttribArray(loc);
|
||||
}
|
||||
|
||||
// Create triangles covering the domain
|
||||
const positions = new Int16Array((width-1)*(height-1)*2*3);
|
||||
for (let j = 0; j < height - 1; j += 1) {
|
||||
for (let i = 0; i < width - 1; i += 1) {
|
||||
const n = 2*3*((width-1)*j + i);
|
||||
positions[n+0] = width*j + i;
|
||||
positions[n+1] = width*j + i+1;
|
||||
positions[n+2] = width*(j+1) + i;
|
||||
positions[n+3] = width*j + i+1;
|
||||
positions[n+4] = width*(j+1) + i;
|
||||
positions[n+5] = width*(j+1) + i+1;
|
||||
}
|
||||
}
|
||||
|
||||
const indexBuffer = gl.createBuffer();
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
|
||||
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, positions, gl.STATIC_DRAW);
|
||||
|
||||
const bbox = [+Number(Infinity), -Number(Infinity), +Number(Infinity), -Number(Infinity)];
|
||||
for (let i = 0; i < width*height; i += 1) {
|
||||
bbox[0] = Math.min(bbox[0], x[i]);
|
||||
bbox[1] = Math.max(bbox[1], x[i]);
|
||||
bbox[2] = Math.min(bbox[2], y[i]);
|
||||
bbox[3] = Math.max(bbox[3], y[i]);
|
||||
}
|
||||
|
||||
{
|
||||
const loc = gl.getUniformLocation(shaderProgram, "uBbox");
|
||||
gl.uniform4f(loc, bbox[0], 1.0/(bbox[1] - bbox[0]), bbox[2], 1.0/(bbox[3] - bbox[2]));
|
||||
}
|
||||
|
||||
const TIMEFACTOR = 10000.0;
|
||||
const MAX_DT = 1.0/Math.max(width, height);
|
||||
|
||||
let t = 0;
|
||||
let firstDraw = true;
|
||||
let warnTime = -1;
|
||||
const chosenField = {
|
||||
"uLocation": gl.getUniformLocation(shaderProgram, "uChosenField"),
|
||||
"value": 2,
|
||||
"cycle": function cycle() {
|
||||
if (this.value === 0) {
|
||||
this.value = 1;
|
||||
} else if (this.value === 1) {
|
||||
this.value = 2;
|
||||
} else {
|
||||
this.value = 0;
|
||||
}
|
||||
gl.uniform1i(this.uLocation, this.value);
|
||||
}
|
||||
};
|
||||
chosenField.cycle();
|
||||
|
||||
universe.init(0.5, 0.5);
|
||||
|
||||
/**
|
||||
* Integrates and draws the next iteration
|
||||
* @param {Time} timeOfDraw Time of drawing
|
||||
*/
|
||||
function drawMe(timeOfDraw) {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
|
||||
let dt = (timeOfDraw - t) / TIMEFACTOR;
|
||||
t = timeOfDraw;
|
||||
if (firstDraw || dt <= 0.0) {
|
||||
firstDraw = false;
|
||||
dt = MAX_DT;
|
||||
} else {
|
||||
if (dt >= MAX_DT) {
|
||||
warnTime += 1;
|
||||
if (warnTime !== -2) {
|
||||
console.warn("Can not keep up with framerate");
|
||||
}
|
||||
dt = MAX_DT;
|
||||
}
|
||||
}
|
||||
|
||||
let fieldPtr;
|
||||
if (chosenField.value === 0) {
|
||||
fieldPtr = universe.get_eta_ptr();
|
||||
} else if (chosenField.value === 1) {
|
||||
fieldPtr = universe.get_etau_ptr();
|
||||
} else {
|
||||
fieldPtr = universe.get_etav_ptr();
|
||||
}
|
||||
const field = new Float32Array(wasm.memory.buffer, fieldPtr, width*height);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, field, gl.DYNAMIC_DRAW);
|
||||
|
||||
{
|
||||
const offset = 0;
|
||||
const type = gl.UNSIGNED_SHORT;
|
||||
const vertexCount = positions.length;
|
||||
gl.drawElements(gl.TRIANGLES, vertexCount, type, offset);
|
||||
}
|
||||
|
||||
universe.advance();
|
||||
|
||||
window.requestAnimationFrame(drawMe);
|
||||
}
|
||||
|
||||
// https://stackoverflow.com/questions/4288253/html5-canvas-100-width-height-of-viewport#8486324
|
||||
function resizeCanvas() {
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
|
||||
gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
|
||||
}
|
||||
|
||||
window.addEventListener("keyup", event => {
|
||||
if (event.key === "c") {
|
||||
chosenField.cycle();
|
||||
}
|
||||
}, {"passive": true});
|
||||
window.addEventListener("resize", resizeCanvas, false);
|
||||
window.addEventListener("click", event => {
|
||||
// Must adjust for bbox and transformations for x/y
|
||||
const mousex = event.clientX / window.innerWidth;
|
||||
const mousey = event.clientY / window.innerHeight;
|
||||
universe.init(mousex, 1.0 - mousey);
|
||||
}, {"passive": true});
|
||||
|
||||
resizeCanvas();
|
||||
window.requestAnimationFrame(drawMe);
|
||||
}());
|
||||
Reference in New Issue
Block a user