From 1abf7af31d1148f68856cce0d375fafa8c8d6b28 Mon Sep 17 00:00:00 2001 From: Thoralf-M <46689931+Thoralf-M@users.noreply.github.com> Date: Wed, 26 Feb 2020 19:22:08 +0100 Subject: [PATCH 1/9] call npm install call npm install because otherwise it stops there and doesn't execute `npm start` --- examples/wasm-demo/start-server.bat | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/wasm-demo/start-server.bat b/examples/wasm-demo/start-server.bat index b690a398..aee88705 100644 --- a/examples/wasm-demo/start-server.bat +++ b/examples/wasm-demo/start-server.bat @@ -4,5 +4,5 @@ wasm-pack build --release if errorlevel 1 cargo install wasm-pack wasm-pack build --release cd www -npm install +call npm install npm start From 5f3d80185139a2b744f4f9bfb420c91baf56b186 Mon Sep 17 00:00:00 2001 From: genius Date: Sun, 31 May 2020 11:32:58 +0200 Subject: [PATCH 2/9] Fix pistons scaling of circles --- src/drawing/backend_impl/piston.rs | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/drawing/backend_impl/piston.rs b/src/drawing/backend_impl/piston.rs index 4a579056..80e59cd6 100644 --- a/src/drawing/backend_impl/piston.rs +++ b/src/drawing/backend_impl/piston.rs @@ -150,7 +150,11 @@ impl<'a, 'b> DrawingBackend for PistonBackend<'a, 'b> { style: &S, fill: bool, ) -> Result<(), DrawingErrorKind> { - let rect = circle(center.0 as f64, center.1 as f64, radius as f64); + let rect = circle( + center.0 as f64 * self.scale, + center.1 as f64 * self.scale, + radius as f64 * self.scale, + ); if fill { ellipse( make_piston_rgba(&style.as_color()), From 5244a9fdfe0e47b608dc25f5c7a18e3ba9149384 Mon Sep 17 00:00:00 2001 From: genius Date: Tue, 2 Jun 2020 10:37:43 +0200 Subject: [PATCH 3/9] refactored call to piston_window::circle into make_circle and added unit-test for it --- src/drawing/backend_impl/piston.rs | 24 +++++++++++++++++++----- 1 file changed, 19 insertions(+), 5 deletions(-) diff --git a/src/drawing/backend_impl/piston.rs b/src/drawing/backend_impl/piston.rs index 80e59cd6..02605fcb 100644 --- a/src/drawing/backend_impl/piston.rs +++ b/src/drawing/backend_impl/piston.rs @@ -34,6 +34,14 @@ fn make_point_pair(a: BackendCoord, b: BackendCoord, scale: f64) -> [f64; 4] { ] } +fn make_circle(center: BackendCoord, radius: u32, scale: f64) -> [f64; 4] { + circle( + center.0 as f64 * scale, + center.1 as f64 * scale, + radius as f64 * scale, + ) +} + impl<'a, 'b> PistonBackend<'a, 'b> { pub fn new(size: (u32, u32), scale: f64, context: Context, graphics: &'b mut G2d<'a>) -> Self { Self { @@ -150,11 +158,7 @@ impl<'a, 'b> DrawingBackend for PistonBackend<'a, 'b> { style: &S, fill: bool, ) -> Result<(), DrawingErrorKind> { - let rect = circle( - center.0 as f64 * self.scale, - center.1 as f64 * self.scale, - radius as f64 * self.scale, - ); + let rect = make_circle(center, radius, self.scale); if fill { ellipse( make_piston_rgba(&style.as_color()), @@ -208,3 +212,13 @@ pub fn draw_piston_window Result<(), Box Date: Fri, 3 Jul 2020 10:27:46 +0200 Subject: [PATCH 4/9] added missing set_line_width calls in HTML5 canvas backend --- src/drawing/backend_impl/canvas.rs | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/src/drawing/backend_impl/canvas.rs b/src/drawing/backend_impl/canvas.rs index 97ec5df1..37755b95 100644 --- a/src/drawing/backend_impl/canvas.rs +++ b/src/drawing/backend_impl/canvas.rs @@ -61,6 +61,13 @@ impl CanvasBackend { pub fn with_canvas_object(canvas: HtmlCanvasElement) -> Option { Self::init_backend(canvas) } + + /// Sets the stroke style and line width in the underlying context. + fn set_line_style(&mut self, style: &impl BackendStyle) { + self.context + .set_stroke_style(&make_canvas_color(style.as_color())); + self.context.set_line_width(style.stroke_width() as f64); + } } fn make_canvas_color(color: RGBAColor) -> JsValue { @@ -77,8 +84,10 @@ impl DrawingBackend for CanvasBackend { let window = window().unwrap(); let mut dpr = window.device_pixel_ratio(); dpr = if dpr == 0.0 { 1.0 } else { dpr }; - ((self.canvas.width() as f64 / dpr) as u32, - (self.canvas.height() as f64 / dpr) as u32) + ( + (self.canvas.width() as f64 / dpr) as u32, + (self.canvas.height() as f64 / dpr) as u32, + ) } fn ensure_prepared(&mut self) -> Result<(), DrawingErrorKind> { @@ -115,9 +124,7 @@ impl DrawingBackend for CanvasBackend { return Ok(()); } - self.context - .set_stroke_style(&make_canvas_color(style.as_color())); - self.context.set_line_width(style.stroke_width() as f64); + self.set_line_style(style); self.context.begin_path(); self.context.move_to(f64::from(from.0), f64::from(from.1)); self.context.line_to(f64::from(to.0), f64::from(to.1)); @@ -145,8 +152,7 @@ impl DrawingBackend for CanvasBackend { f64::from(bottom_right.1 - upper_left.1), ); } else { - self.context - .set_stroke_style(&make_canvas_color(style.as_color())); + self.set_line_style(style); self.context.stroke_rect( f64::from(upper_left.0), f64::from(upper_left.1), @@ -168,8 +174,7 @@ impl DrawingBackend for CanvasBackend { let mut path = path.into_iter(); self.context.begin_path(); if let Some(start) = path.next() { - self.context - .set_stroke_style(&make_canvas_color(style.as_color())); + self.set_line_style(style); self.context.move_to(f64::from(start.0), f64::from(start.1)); for next in path { self.context.line_to(f64::from(next.0), f64::from(next.1)); @@ -216,8 +221,7 @@ impl DrawingBackend for CanvasBackend { self.context .set_fill_style(&make_canvas_color(style.as_color())); } else { - self.context - .set_stroke_style(&make_canvas_color(style.as_color())); + self.set_line_style(style); } self.context.begin_path(); self.context.arc( From 9b6db0b03b0e0a653760e01fb355ddfadcf29e7f Mon Sep 17 00:00:00 2001 From: Adrien Champion Date: Fri, 3 Jul 2020 11:37:35 +0200 Subject: [PATCH 5/9] fixed get_size for HTML5 canvas --- src/drawing/backend_impl/canvas.rs | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/drawing/backend_impl/canvas.rs b/src/drawing/backend_impl/canvas.rs index 37755b95..8c445b15 100644 --- a/src/drawing/backend_impl/canvas.rs +++ b/src/drawing/backend_impl/canvas.rs @@ -84,9 +84,10 @@ impl DrawingBackend for CanvasBackend { let window = window().unwrap(); let mut dpr = window.device_pixel_ratio(); dpr = if dpr == 0.0 { 1.0 } else { dpr }; + let rect = self.canvas.get_bounding_client_rect(); ( - (self.canvas.width() as f64 / dpr) as u32, - (self.canvas.height() as f64 / dpr) as u32, + (rect.width() as f64 * dpr) as u32, + (rect.height() as f64 * dpr) as u32, ) } From c2d7c8f765aa7d7dd25a69802871821de549dc3f Mon Sep 17 00:00:00 2001 From: Hao Hou Date: Fri, 28 Aug 2020 20:53:22 -0600 Subject: [PATCH 6/9] Fix the CanvasBackend size bug --- examples/wasm-demo/src/func_plot.rs | 1 + examples/wasm-demo/www/index.html | 2 +- examples/wasm-demo/www/index.js | 13 ++++++------- src/drawing/backend_impl/canvas.rs | 6 +----- 4 files changed, 9 insertions(+), 13 deletions(-) diff --git a/examples/wasm-demo/src/func_plot.rs b/examples/wasm-demo/src/func_plot.rs index 7c966cd4..09eb95cd 100644 --- a/examples/wasm-demo/src/func_plot.rs +++ b/examples/wasm-demo/src/func_plot.rs @@ -10,6 +10,7 @@ pub fn draw(canvas_id: &str, power: i32) -> DrawResult Op root.fill(&WHITE)?; let mut chart = ChartBuilder::on(&root) + .margin(20) .caption(format!("y=x^{}", power), font) .x_label_area_size(30) .y_label_area_size(30) diff --git a/examples/wasm-demo/www/index.html b/examples/wasm-demo/www/index.html index ca1357dd..30fc1693 100644 --- a/examples/wasm-demo/www/index.html +++ b/examples/wasm-demo/www/index.html @@ -12,7 +12,7 @@

Plotters WebAssembly Demo

- +
Loading WebAssembly...
diff --git a/examples/wasm-demo/www/index.js b/examples/wasm-demo/www/index.js index abec4ac4..c0ff11c6 100644 --- a/examples/wasm-demo/www/index.js +++ b/examples/wasm-demo/www/index.js @@ -30,14 +30,13 @@ function setupUI() { /** Setup canvas to properly handle high DPI and redraw current plot. */ function setupCanvas() { - const dpr = window.devicePixelRatio || 1; + const dpr = window.devicePixelRatio || 1.0; const aspectRatio = canvas.width / canvas.height; - const size = Math.min(canvas.width, canvas.parentNode.offsetWidth); - canvas.style.width = size + "px"; - canvas.style.height = size / aspectRatio + "px"; - canvas.width = size * dpr; - canvas.height = size / aspectRatio * dpr; - canvas.getContext("2d").scale(dpr, dpr); + const size = canvas.parentNode.offsetWidth * 0.8; + canvas.style.width = size * dpr + "px"; + canvas.style.height = size * dpr / aspectRatio + "px"; + canvas.width = size; + canvas.height = size / aspectRatio; updatePlot(); } diff --git a/src/drawing/backend_impl/canvas.rs b/src/drawing/backend_impl/canvas.rs index 97ec5df1..2a185c5b 100644 --- a/src/drawing/backend_impl/canvas.rs +++ b/src/drawing/backend_impl/canvas.rs @@ -73,12 +73,8 @@ impl DrawingBackend for CanvasBackend { type ErrorType = CanvasError; fn get_size(&self) -> (u32, u32) { - // Getting just canvas.width gives poor results on HighDPI screens. let window = window().unwrap(); - let mut dpr = window.device_pixel_ratio(); - dpr = if dpr == 0.0 { 1.0 } else { dpr }; - ((self.canvas.width() as f64 / dpr) as u32, - (self.canvas.height() as f64 / dpr) as u32) + (self.canvas.width(), self.canvas.height()) } fn ensure_prepared(&mut self) -> Result<(), DrawingErrorKind> { From a1c0b3285b065c50aaa02126f5ec6d6af3f050ad Mon Sep 17 00:00:00 2001 From: Hao Hou Date: Fri, 28 Aug 2020 22:28:03 -0600 Subject: [PATCH 7/9] Fix the WASM example for the coordinate mapping --- examples/wasm-demo/www/index.js | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/examples/wasm-demo/www/index.js b/examples/wasm-demo/www/index.js index c0ff11c6..84c11d28 100644 --- a/examples/wasm-demo/www/index.js +++ b/examples/wasm-demo/www/index.js @@ -43,10 +43,18 @@ function setupCanvas() { /** Update displayed coordinates. */ function onMouseMove(event) { if (chart) { - const point = chart.coord(event.offsetX, event.offsetY); - coord.innerText = (point) - ? `(${point.x.toFixed(3)}, ${point.y.toFixed(3)})` - : "Mouse pointer is out of range"; + var text = "Mouse pointer is out of range"; + + if(event.target == canvas) { + let actualRect = canvas.getBoundingClientRect(); + let logicX = event.offsetX * canvas.width / actualRect.width; + let logicY = event.offsetY * canvas.height / actualRect.height; + const point = chart.coord(logicX, logicY); + text = (point) + ? `(${point.x.toFixed(3)}, ${point.y.toFixed(3)})` + : text; + } + coord.innerText = text; } } From b9d25defc9033c08e1344b5c96d7a1ebfaf82713 Mon Sep 17 00:00:00 2001 From: Hao Hou Date: Fri, 28 Aug 2020 22:34:40 -0600 Subject: [PATCH 8/9] remomve unused variable --- src/drawing/backend_impl/canvas.rs | 1 - 1 file changed, 1 deletion(-) diff --git a/src/drawing/backend_impl/canvas.rs b/src/drawing/backend_impl/canvas.rs index 2a185c5b..431c03fb 100644 --- a/src/drawing/backend_impl/canvas.rs +++ b/src/drawing/backend_impl/canvas.rs @@ -73,7 +73,6 @@ impl DrawingBackend for CanvasBackend { type ErrorType = CanvasError; fn get_size(&self) -> (u32, u32) { - let window = window().unwrap(); (self.canvas.width(), self.canvas.height()) } From 7d5bab37ebb62b495fc83abbfd914b48db259b2e Mon Sep 17 00:00:00 2001 From: Hao Hou Date: Sat, 29 Aug 2020 16:35:47 -0600 Subject: [PATCH 9/9] fix wasm example --- examples/wasm-demo/www/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/wasm-demo/www/index.js b/examples/wasm-demo/www/index.js index 84c11d28..f6abb18c 100644 --- a/examples/wasm-demo/www/index.js +++ b/examples/wasm-demo/www/index.js @@ -33,8 +33,8 @@ function setupCanvas() { const dpr = window.devicePixelRatio || 1.0; const aspectRatio = canvas.width / canvas.height; const size = canvas.parentNode.offsetWidth * 0.8; - canvas.style.width = size * dpr + "px"; - canvas.style.height = size * dpr / aspectRatio + "px"; + canvas.style.width = size + "px"; + canvas.style.height = size / aspectRatio + "px"; canvas.width = size; canvas.height = size / aspectRatio; updatePlot();