Skip to content

Commit 37e95d1

Browse files
felipeasimosfelipeasimos
committed
fixed
1 parent 4ba3bf0 commit 37e95d1

File tree

12 files changed

+1174
-100
lines changed

12 files changed

+1174
-100
lines changed

‎Cargo.lock

Lines changed: 1088 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Cargo.toml

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,15 @@ edition = "2018"
88
crate-type=["cdylib"]
99

1010
[dependencies]
11-
plotters = "^0.3.2"
12-
wasm-bindgen = "0.2.78"
13-
wee_alloc = "0.4.5"
14-
web-sys = { version = "0.3.39", features = ["HtmlCanvasElement"] }
15-
plotters-canvas = "^0.3.0"
11+
lol_alloc = "0.4.1"
12+
plotters = "0.3.7"
13+
plotters-canvas = "0.3.1"
14+
wasm-bindgen = "0.2"
15+
web-sys = { version = "0.3", features = [
16+
"Document",
17+
"Window",
18+
"Element",
19+
]}
1620

1721
[profile.release]
1822
lto = true

‎src/func_plot.rs

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,11 @@ use plotters::prelude::*;
33
use plotters_canvas::CanvasBackend;
44

55
/// Draw power function f(x) = x^power.
6-
pub fn draw(canvas_id: &str, power: i32) -> DrawResult<impl Fn((i32, i32)) -> Option<(f32, f32)>> {
7-
let backend = CanvasBackend::new(canvas_id).expect("cannot find canvas");
6+
pub fn draw(
7+
canvas_id: String,
8+
power: i32,
9+
) -> DrawResult<impl Fn((i32, i32)) -> Option<(f64, f64)>> {
10+
let backend = CanvasBackend::new(canvas_id.as_str()).expect("cannot find canvas");
811
let root = backend.into_drawing_area();
912
let font: FontDesc = ("sans-serif", 20.0).into();
1013

@@ -15,17 +18,18 @@ pub fn draw(canvas_id: &str, power: i32) -> DrawResult<impl Fn((i32, i32)) -> Op
1518
.caption(format!("y=x^{}", power), font)
1619
.x_label_area_size(30u32)
1720
.y_label_area_size(30u32)
18-
.build_cartesian_2d(-1f32..1f32, -1.2f32..1.2f32)?;
21+
.build_cartesian_2d(-1f64..1f64, -1.2f64..1.2f64)?;
1922

2023
chart.configure_mesh().x_labels(3).y_labels(3).draw()?;
2124

2225
chart.draw_series(LineSeries::new(
2326
(-50..=50)
24-
.map(|x| x as f32 / 50.0)
25-
.map(|x| (x, x.powf(power as f32))),
27+
.map(|x| x as f64 / 50.0)
28+
.map(|x| (x, x.powf(power as f64))),
2629
&RED,
2730
))?;
2831

2932
root.present()?;
3033
return Ok(chart.into_coord_trans());
3134
}
35+

‎src/lib.rs

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,13 @@ mod func_plot;
55
mod mandelbrot;
66
mod plot3d;
77

8+
#[cfg(target_arch = "wasm32")]
9+
use lol_alloc::{FreeListAllocator, LockedAllocator};
10+
11+
#[cfg(target_arch = "wasm32")]
812
#[global_allocator]
9-
static ALLOC: wee_alloc::WeeAlloc = wee_alloc::WeeAlloc::INIT;
13+
static ALLOCATOR: LockedAllocator<FreeListAllocator> =
14+
LockedAllocator::new(FreeListAllocator::new());
1015

1116
/// Type alias for the result of a drawing function.
1217
pub type DrawResult<T> = Result<T, Box<dyn std::error::Error>>;
@@ -29,10 +34,10 @@ pub struct Point {
2934
impl Chart {
3035
/// Draw provided power function on the canvas element using it's id.
3136
/// Return `Chart` struct suitable for coordinate conversion.
32-
pub fn power(canvas_id: &str, power: i32) -> Result<Chart, JsValue> {
37+
pub fn power(canvas_id: String, power: i32) -> Result<Chart, JsValue> {
3338
let map_coord = func_plot::draw(canvas_id, power).map_err(|err| err.to_string())?;
3439
Ok(Chart {
35-
convert: Box::new(move |coord| map_coord(coord).map(|(x, y)| (x.into(), y.into()))),
40+
convert: Box::new(map_coord),
3641
})
3742
}
3843

‎start-server.bat

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
if not exist "www\pkg" mkdir www\pkg
22
rustup target add wasm32-unknown-unknown
3-
wasm-pack build --release
3+
wasm-pack build --release --out-dir www\pkg
44
if errorlevel 1 cargo install wasm-pack
5-
wasm-pack build --release
5+
wasm-pack build --release --out-dir www\pkg
66
cd www
77
call npm install
88
npm start

‎start-server.sh

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
set -e
33

44
CONFIG=release
5-
mkdir -p www/pkg
65

76
rustup target add wasm32-unknown-unknown
87

@@ -13,9 +12,9 @@ fi
1312

1413
if [ "${CONFIG}" = "release" ]
1514
then
16-
wasm-pack build
15+
wasm-pack build --target web
1716
else
18-
wasm-pack build --release
17+
wasm-pack build --release --target web
1918
fi
2019

2120
cd www

‎www/bootstrap.js

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎www/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
</head>
99
<body>
1010
<noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
11-
<script src="./bootstrap.js"></script>
11+
<script src="./index.js" type="module"></script>
1212
<main>
1313
<h1>Plotters WebAssembly Demo</h1>
1414
<div id="coord"></div>

‎www/index.js

Lines changed: 39 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
// If you only use `npm` you can simply
2-
// import { Chart } from "wasm-demo" and remove `setup` call from `bootstrap.js`.
3-
class Chart {}
1+
import { Chart, default as init } from "wasm-demo";
42

53
const canvas = document.getElementById("canvas");
64
const coord = document.getElementById("coord");
@@ -12,63 +10,66 @@ const status = document.getElementById("status");
1210

1311
let chart = null;
1412

13+
initialize();
14+
15+
async function initialize() {
16+
await init();
17+
main();
18+
}
19+
1520
/** Main entry point */
1621
export function main() {
17-
let hash = location.hash.substr(1);
18-
for(var i = 0; i < plotType.options.length; i++) {
19-
if(hash == plotType.options[i].value) {
22+
let hash = location.hash.slice(1);
23+
for (var i = 0; i < plotType.options.length; i++) {
24+
if (hash == plotType.options[i].value) {
2025
plotType.value = hash;
2126
}
2227
}
23-
setupUI();
24-
setupCanvas();
25-
}
26-
27-
/** This function is used in `bootstrap.js` to setup imports. */
28-
export function setup(WasmChart) {
29-
Chart = WasmChart;
28+
init();
29+
setupUI();
30+
setupCanvas();
3031
}
3132

3233
/** Add event listeners. */
3334
function setupUI() {
34-
status.innerText = "WebAssembly loaded!";
35-
plotType.addEventListener("change", updatePlot);
35+
status.innerText = "WebAssembly loaded!";
36+
plotType.addEventListener("change", updatePlot);
3637
yaw.addEventListener("change", updatePlot);
3738
pitch.addEventListener("change", updatePlot);
3839
yaw.addEventListener("input", updatePlot);
3940
pitch.addEventListener("input", updatePlot);
40-
window.addEventListener("resize", setupCanvas);
41-
window.addEventListener("mousemove", onMouseMove);
41+
window.addEventListener("resize", setupCanvas);
42+
window.addEventListener("mousemove", onMouseMove);
4243
}
4344

4445
/** Setup canvas to properly handle high DPI and redraw current plot. */
4546
function setupCanvas() {
4647
const dpr = window.devicePixelRatio || 1.0;
47-
const aspectRatio = canvas.width / canvas.height;
48-
const size = canvas.parentNode.offsetWidth * 0.8;
49-
canvas.style.width = size + "px";
50-
canvas.style.height = size / aspectRatio + "px";
51-
canvas.width = size;
52-
canvas.height = size / aspectRatio;
53-
updatePlot();
48+
const aspectRatio = canvas.width / canvas.height;
49+
const size = canvas.parentNode.offsetWidth * 0.8;
50+
canvas.style.width = size + "px";
51+
canvas.style.height = size / aspectRatio + "px";
52+
canvas.width = size;
53+
canvas.height = size / aspectRatio;
54+
updatePlot();
5455
}
5556

5657
/** Update displayed coordinates. */
5758
function onMouseMove(event) {
58-
if (chart) {
59+
if (chart) {
5960
var text = "Mouse pointer is out of range";
6061

61-
if(event.target == canvas) {
62+
if (event.target == canvas) {
6263
let actualRect = canvas.getBoundingClientRect();
6364
let logicX = event.offsetX * canvas.width / actualRect.width;
6465
let logicY = event.offsetY * canvas.height / actualRect.height;
6566
const point = chart.coord(logicX, logicY);
66-
text = (point)
67+
text = (point)
6768
? `(${point.x.toFixed(3)}, ${point.y.toFixed(3)})`
6869
: text;
6970
}
70-
coord.innerText = text;
71-
}
71+
coord.innerText = text;
72+
}
7273
}
7374

7475
function updatePlot3d() {
@@ -80,24 +81,24 @@ function updatePlot3d() {
8081

8182
/** Redraw currently selected plot. */
8283
function updatePlot() {
83-
const selected = plotType.selectedOptions[0];
84-
status.innerText = `Rendering ${selected.innerText}...`;
85-
chart = null;
86-
const start = performance.now();
87-
switch(selected.value) {
84+
const selected = plotType.selectedOptions[0];
85+
status.innerText = `Rendering ${selected.innerText}...`;
86+
chart = null;
87+
const start = performance.now();
88+
switch (selected.value) {
8889
case "mandelbrot":
8990
control.classList.add("hide");
9091
chart = Chart.mandelbrot(canvas);
9192
break;
92-
case "3d-plot":
93+
case "3d-plot":
9394
control.classList.remove("hide");
9495
updatePlot3d();
9596
break;
9697
default:
9798
control.classList.add("hide");
9899
chart = Chart.power("canvas", Number(selected.value))
99100
}
100-
101-
const end = performance.now();
102-
status.innerText = `Rendered ${selected.innerText} in ${Math.ceil(end - start)}ms`;
101+
102+
const end = performance.now();
103+
status.innerText = `Rendered ${selected.innerText} in ${Math.ceil(end - start)}ms`;
103104
}

‎www/package.json

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@
44
"description": "Plotters WASM Demo",
55
"main": "index.js",
66
"scripts": {
7-
"build": "webpack --config webpack.config.js",
8-
"start": "webpack-dev-server"
7+
"start": "vite build && vite"
98
},
109
"repository": {
1110
"type": "git",
@@ -15,7 +14,7 @@
1514
"webassembly",
1615
"wasm",
1716
"rust",
18-
"webpack",
17+
"vite",
1918
"visualization"
2019
],
2120
"author": "Plotters Developers",
@@ -25,12 +24,12 @@
2524
},
2625
"homepage": "https://github.com/38/plotters",
2726
"dependencies": {
28-
"wasm-demo": "file:../pkg"
27+
"wasm-demo": "file:../pkg",
28+
"wasm-loader": "^1.3.0"
2929
},
3030
"devDependencies": {
31-
"webpack": "^4.43.0",
32-
"webpack-cli": "^3.3.11",
33-
"webpack-dev-server": "^3.10.3",
34-
"copy-webpack-plugin": "^5.0.0"
31+
"@rollup/plugin-wasm": "^6.2.2",
32+
"vite": "^6.2.0",
33+
"vite-plugin-wasm": "^3.4.1"
3534
}
3635
}

0 commit comments

Comments
 (0)