js_canvas_rendering_context_2d

Struct CanvasRenderingContext2D

Source 
pub struct CanvasRenderingContext2D {}

Implementations§

Source§

impl CanvasRenderingContext2D

Source

pub fn get_canvas_height() -> f32

Examples found in repository?
examples/game-of-life.rs (line 176)
175 fn get_canvas_dimensions() -> (f32, f32){
176     (CanvasRenderingContext2D::get_canvas_width(),CanvasRenderingContext2D::get_canvas_height())
177 }
More examples
Hide additional examples
examples/big-m.rs (line 44)
42fn get_offsets() -> (f32,f32){
43   let canvas_w = CanvasRenderingContext2D::get_canvas_width();
44   let canvas_h = CanvasRenderingContext2D::get_canvas_height();
45
46   let square_side = canvas_w.min(canvas_h);
47   let offset_x = (canvas_w - square_side) / 2.;
48   let offset_y = (canvas_h - square_side) / 2.;
49   (offset_x,offset_y)
50}
51
52fn get_coeff() -> f32{
53   let canvas_w = CanvasRenderingContext2D::get_canvas_width();
54   let canvas_h = CanvasRenderingContext2D::get_canvas_height();
55
56   let square_side = canvas_w.min(canvas_h);
57
58   square_side / 100.0
59}
examples/clear-rect.rs (line 11)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
Source

pub fn get_canvas_width() -> f32

Examples found in repository?
examples/game-of-life.rs (line 176)
175 fn get_canvas_dimensions() -> (f32, f32){
176     (CanvasRenderingContext2D::get_canvas_width(),CanvasRenderingContext2D::get_canvas_height())
177 }
More examples
Hide additional examples
examples/big-m.rs (line 43)
42fn get_offsets() -> (f32,f32){
43   let canvas_w = CanvasRenderingContext2D::get_canvas_width();
44   let canvas_h = CanvasRenderingContext2D::get_canvas_height();
45
46   let square_side = canvas_w.min(canvas_h);
47   let offset_x = (canvas_w - square_side) / 2.;
48   let offset_y = (canvas_h - square_side) / 2.;
49   (offset_x,offset_y)
50}
51
52fn get_coeff() -> f32{
53   let canvas_w = CanvasRenderingContext2D::get_canvas_width();
54   let canvas_h = CanvasRenderingContext2D::get_canvas_height();
55
56   let square_side = canvas_w.min(canvas_h);
57
58   square_side / 100.0
59}
examples/clear-rect.rs (line 12)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
Source

pub fn set_fill_style_rgba(r: u8, g: u8, b: u8, a: u8)

setter for property that specifies the color to use for the fills (outlines) around shapes. The default is black. see CanvasRenderingContext2D.fillStyle

§Parameters
  • ‘r’ - value from 0 to 255 that represents how much red is in the color
  • ‘g’ - value from 0 to 255 that represents how much green is in the color
  • ‘b’ - value from 0 to 255 that represents how much blue is in the color
  • ‘a’ - value from 0 to 255 that represents how opaque the color is
Examples found in repository?
examples/fill-style.rs (line 12)
9pub extern "C" fn draw(){
10    for i in 0..6{
11        for j in 0..6 {
12            CanvasRenderingContext2D::set_fill_style_rgba((255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 0, 255);
13            CanvasRenderingContext2D::fill_rect(j as f32 * 25., i as f32 * 25., 25., 25.);
14        }
15    }
16}
More examples
Hide additional examples
examples/shadow-boxes.rs (line 15)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
examples/clear-rect.rs (line 16)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
examples/game-of-life.rs (line 121)
100    pub fn draw(&self){
101        let (canvas_w,canvas_h) = get_canvas_dimensions();
102        let (offset_x, offset_y) = get_offsets(canvas_w, canvas_h);
103        let coeff = get_coeff(canvas_w, canvas_h);
104
105        
106        CanvasRenderingContext2D::clear_rect(0., 0., canvas_w, canvas_h);
107
108        let cell_width = 100.0 / self.width as f32;
109        let cell_height = 100.0 / self.height as f32;
110        let mut x_i = 0;
111        let mut y_i= 0;
112
113        for line in self.cells.as_slice().chunks(self.width as usize) {
114            for &cell in line {
115                if cell == Cell::Alive{
116                    let start_x = apply_transformation(x_i as f32 * cell_width, coeff, offset_x);
117                    let start_y = apply_transformation(y_i as f32 * cell_height, coeff, offset_y);
118
119
120                    CanvasRenderingContext2D::begin_path();
121                    CanvasRenderingContext2D::set_fill_style_rgba(200, 200, 200,255);
122                    CanvasRenderingContext2D::fill_rect(start_x, start_y,cell_width, cell_height);
123                }
124                
125                x_i += 1;
126            }
127            x_i = 0;
128            y_i += 1;
129        }
130    }
Source

pub fn get_line_join() -> LineJoin

getter for property that determines the shape used to join two line segments where they meet. see CanvasRenderingContext2D.lineJap

Source

pub fn set_line_join(value: LineJoin)

setter for property that determines the shape used to join two line segments where they meet. see CanvasRenderingContext2D.lineJoin

§Parameters
  • ‘value’ - the type of line join. Valid options are Bevel, Round, Miter
Examples found in repository?
examples/line-joins.rs (line 16)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
Source

pub fn get_line_cap() -> LineCap

getter for property that determines the shape used to draw the end points of lines. see CanvasRenderingContext2D.lineCap

Source

pub fn set_line_cap(value: LineCap)

setter for property that determines the shape used to draw the end points of lines. see CanvasRenderingContext2D.lineCap

§Parameters
  • ‘value’ - the type of line cap. Valid options are Butt, Round, Square
Examples found in repository?
examples/line-caps.rs (line 24)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn get_line_width() -> u32

getter for property that sets the thickness of lines. see CanvasRenderingContext2D.lineWidth

Source

pub fn set_line_width(value: u32)

setter for property that sets the thickness of lines. see CanvasRenderingContext2D.lineWidth

§Parameters
  • ‘value’ - the thickness of lines. Must be a non-zero positive number
Examples found in repository?
examples/big-m.rs (line 20)
9pub extern "C" fn draw(){
10   let (x_offset, y_offset) = get_offsets();
11   let coeff = get_coeff();
12
13
14   local_move_to(5.,95.,x_offset,y_offset,coeff);
15   local_line_to(10.,15.,x_offset,y_offset,coeff);
16   local_line_to(50.,70.,x_offset,y_offset,coeff);
17   local_line_to(90.,15.,x_offset,y_offset,coeff);
18   local_line_to(95.,95.,x_offset,y_offset,coeff);
19
20   CanvasRenderingContext2D::set_line_width(15 * coeff.floor() as u32);
21   CanvasRenderingContext2D::stroke();
22}
More examples
Hide additional examples
examples/shadow-boxes.rs (line 18)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
examples/line-joins.rs (line 13)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/line-caps.rs (line 23)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn get_shadow_blur() -> u32

getter for property that specifies the amount of blur applied to shadows. The default is 0 (no blur). see CanvasRenderingContext2D.shadowBlur

Source

pub fn set_shadow_blur(value: u32)

setter for property that specifies the amount of blur applied to shadows. The default is 0 (no blur). see CanvasRenderingContext2D.shadowBlur

§Parameters
  • ‘value’ - the the level of shadow blur. A zero value indicates no blur.
Examples found in repository?
examples/shadow-boxes.rs (line 11)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
Source

pub fn set_shadow_color_rgba(r: u8, g: u8, b: u8, a: u8)

setter for property that specifies the color of shadows. The default is fully transparent black. see CanvasRenderingContext2D.shadowColor

§Parameters
  • ‘r’ - value from 0 to 255 that represents how much red is in the color
  • ‘g’ - value from 0 to 255 that represents how much green is in the color
  • ‘b’ - value from 0 to 255 that represents how much blue is in the color
  • ‘a’ - value from 0 to 255 that represents how opaque the color is
Examples found in repository?
examples/shadow-boxes.rs (line 10)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
Source

pub fn get_shadow_offset_x() -> i32

getter for property that specifies the distance that shadows will be offset horizontally. The default is 0 (no horizontal offset). see CanvasRenderingContext2D.shadowOffsetX

Source

pub fn set_shadow_offset_x(value: i32)

setter for property that specifies the distance that shadows will be offset horizontally. The default is 0 (no horizontal offset). see CanvasRenderingContext2D.shadowOffsetX

§Parameters
  • ‘value’ - the the distance of horizontal offset. Positive values are to the right, and negative to the left.
Examples found in repository?
examples/shadow-boxes.rs (line 12)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
Source

pub fn get_shadow_offset_y() -> i32

getter for property that specifies the distance that shadows will be offset vertically. The default is 0 (no vertical offset). see CanvasRenderingContext2D.shadowOffsetY

Source

pub fn set_shadow_offset_y(value: i32)

setter for property that specifies the distance that shadows will be offset vertically. The default is 0 (no vertical offset). see CanvasRenderingContext2D.shadowOffsetY

§Parameters
  • ‘value’ - the the distance of vertical offset. Positive values are down, and negative are up.
Examples found in repository?
examples/shadow-boxes.rs (line 13)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
Source

pub fn set_stroke_style_rgba(r: u8, g: u8, b: u8, a: u8)

setter for property that specifies the color to use for the strokes (outlines) around shapes. The default is black. see CanvasRenderingContext2D.strokeStyle

§Parameters
  • ‘r’ - value from 0 to 255 that represents how much red is in the color
  • ‘g’ - value from 0 to 255 that represents how much green is in the color
  • ‘b’ - value from 0 to 255 that represents how much blue is in the color
  • ‘a’ - value from 0 to 255 that represents how opaque the color is
Examples found in repository?
examples/multi-color-circles.rs (line 13)
10pub extern "C" fn draw(){
11    for i in 0..6{
12        for j in 0..6 {
13            CanvasRenderingContext2D::set_stroke_style_rgba(0, (255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 255);
14            CanvasRenderingContext2D::begin_path();
15            CanvasRenderingContext2D::arc(12.5 + (j * 25) as f32, 12.5 + (i * 25) as f32, 10., 0., PI * 2.0, true);
16            CanvasRenderingContext2D::stroke();
17        }
18    }
19}
More examples
Hide additional examples
examples/shadow-boxes.rs (line 19)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
examples/line-joins.rs (line 12)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/line-caps.rs (line 12)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn arc( x: f32, y: f32, radius: f32, start_angle: f32, end_angle: f32, counter_clockwise: bool, )

adds a circular arc to the current sub-path. see CanvasRenderingContext2D.arc

§Parameters
  • ‘x’ - the horizontal coordinate of the arc’s center
  • ‘y’ - the vertical coordinate of the arc’s center
  • ‘radius’ - the arc’s radius. Must be positive
  • ‘start_angle’ - the angle at which the arc starts in radians, measured from the positive x-axis
  • ‘end_angle’ - the angle at which the arc ends in radians, measured from the positive x-axis
  • ‘counter_clockwise’ - if true, draws the arc counter-clockwise between the start and end angles
Examples found in repository?
examples/multi-color-circles.rs (line 15)
10pub extern "C" fn draw(){
11    for i in 0..6{
12        for j in 0..6 {
13            CanvasRenderingContext2D::set_stroke_style_rgba(0, (255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 255);
14            CanvasRenderingContext2D::begin_path();
15            CanvasRenderingContext2D::arc(12.5 + (j * 25) as f32, 12.5 + (i * 25) as f32, 10., 0., PI * 2.0, true);
16            CanvasRenderingContext2D::stroke();
17        }
18    }
19}
Source

pub fn arc_to(x1: f32, y1: f32, x2: f32, y2: f32, radius: f32)

adds a circular arc to the current sub-path, using the given control points and radius. The arc is automatically connected to the path’s latest point with a straight line, if necessary for the specified parameters. see CanvasRenderingContext2D.arcTo

§Parameters
  • ‘x1’ - the x-axis coordinate of the first control point
  • ‘y1’ - the y-axis coordinate of the first control point.
  • ‘x2’ - the x-axis coordinate of the second control point
  • ‘y2’ - the y-axis coordinate of the second control point.
  • ‘radius’ - the arc’s radius. Must be positive
Source

pub fn begin_path()

starts a new path by emptying the list of sub-paths. Call this method when you want to create a new path. see CanvasRenderingContext2D.beginPath

§Parameters (none)
Examples found in repository?
examples/multi-color-circles.rs (line 14)
10pub extern "C" fn draw(){
11    for i in 0..6{
12        for j in 0..6 {
13            CanvasRenderingContext2D::set_stroke_style_rgba(0, (255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 255);
14            CanvasRenderingContext2D::begin_path();
15            CanvasRenderingContext2D::arc(12.5 + (j * 25) as f32, 12.5 + (i * 25) as f32, 10., 0., PI * 2.0, true);
16            CanvasRenderingContext2D::stroke();
17        }
18    }
19}
More examples
Hide additional examples
examples/line-joins.rs (line 17)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/clear-rect.rs (line 15)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
examples/line-caps.rs (line 11)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
examples/game-of-life.rs (line 120)
100    pub fn draw(&self){
101        let (canvas_w,canvas_h) = get_canvas_dimensions();
102        let (offset_x, offset_y) = get_offsets(canvas_w, canvas_h);
103        let coeff = get_coeff(canvas_w, canvas_h);
104
105        
106        CanvasRenderingContext2D::clear_rect(0., 0., canvas_w, canvas_h);
107
108        let cell_width = 100.0 / self.width as f32;
109        let cell_height = 100.0 / self.height as f32;
110        let mut x_i = 0;
111        let mut y_i= 0;
112
113        for line in self.cells.as_slice().chunks(self.width as usize) {
114            for &cell in line {
115                if cell == Cell::Alive{
116                    let start_x = apply_transformation(x_i as f32 * cell_width, coeff, offset_x);
117                    let start_y = apply_transformation(y_i as f32 * cell_height, coeff, offset_y);
118
119
120                    CanvasRenderingContext2D::begin_path();
121                    CanvasRenderingContext2D::set_fill_style_rgba(200, 200, 200,255);
122                    CanvasRenderingContext2D::fill_rect(start_x, start_y,cell_width, cell_height);
123                }
124                
125                x_i += 1;
126            }
127            x_i = 0;
128            y_i += 1;
129        }
130    }
Source

pub fn clear_rect(x: f32, y: f32, width: f32, height: f32)

erases the pixels in a rectangular area by setting them to transparent black. see CanvasRenderingContext2D.clearRect

§Parameters
  • ‘x’ - the x-axis coordinate of the rectangle’s starting point.
  • ‘y’ - the y-axis coordinate of the rectangle’s starting point.
  • ‘width’ - the rectangle’s width. Positive values are to the right, and negative to the left.
  • ‘height’ - the rectangle’s height. Positive values are down, and negative are up.
Examples found in repository?
examples/clear-rect.rs (line 29)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
More examples
Hide additional examples
examples/game-of-life.rs (line 106)
100    pub fn draw(&self){
101        let (canvas_w,canvas_h) = get_canvas_dimensions();
102        let (offset_x, offset_y) = get_offsets(canvas_w, canvas_h);
103        let coeff = get_coeff(canvas_w, canvas_h);
104
105        
106        CanvasRenderingContext2D::clear_rect(0., 0., canvas_w, canvas_h);
107
108        let cell_width = 100.0 / self.width as f32;
109        let cell_height = 100.0 / self.height as f32;
110        let mut x_i = 0;
111        let mut y_i= 0;
112
113        for line in self.cells.as_slice().chunks(self.width as usize) {
114            for &cell in line {
115                if cell == Cell::Alive{
116                    let start_x = apply_transformation(x_i as f32 * cell_width, coeff, offset_x);
117                    let start_y = apply_transformation(y_i as f32 * cell_height, coeff, offset_y);
118
119
120                    CanvasRenderingContext2D::begin_path();
121                    CanvasRenderingContext2D::set_fill_style_rgba(200, 200, 200,255);
122                    CanvasRenderingContext2D::fill_rect(start_x, start_y,cell_width, cell_height);
123                }
124                
125                x_i += 1;
126            }
127            x_i = 0;
128            y_i += 1;
129        }
130    }
Source

pub fn close_path()

attempts to add a straight line from the current point to the start of the current sub-path. If the shape has already been closed or has only one point, this function does nothing.

This method doesn’t draw anything to the canvas directly. You can render the path using the stroke() or fill() methods. see CanvasRenderingContext2D.closePath

§Parameters (none)
Examples found in repository?
examples/clear-rect.rs (line 25)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
Source

pub fn fill()

fills the current path with the current fillStyle

see CanvasRenderingContext2D.fill

§Parameters (none)
Examples found in repository?
examples/clear-rect.rs (line 26)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
Source

pub fn fill_rect(x: f32, y: f32, width: f32, height: f32)

draws a rectangle that is filled according to the current fillStyle.

This method draws directly to the canvas without modifying the current path, so any subsequent fill() or stroke() calls will have no effect on it.

see CanvasRenderingContext2D.fillRect

§Parameters
  • ‘x’ - the x-axis coordinate of the rectangle’s starting point.
  • ‘y’ - the y-axis coordinate of the rectangle’s starting point.
  • ‘width’ - the rectangle’s width. Positive values are to the right, and negative to the left.
  • ‘height’ - the rectangle’s height. Positive values are down, and negative are up.
Examples found in repository?
examples/fill-style.rs (line 13)
9pub extern "C" fn draw(){
10    for i in 0..6{
11        for j in 0..6 {
12            CanvasRenderingContext2D::set_fill_style_rgba((255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 0, 255);
13            CanvasRenderingContext2D::fill_rect(j as f32 * 25., i as f32 * 25., 25., 25.);
14        }
15    }
16}
More examples
Hide additional examples
examples/shadow-boxes.rs (line 16)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}
examples/clear-rect.rs (line 17)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
examples/game-of-life.rs (line 122)
100    pub fn draw(&self){
101        let (canvas_w,canvas_h) = get_canvas_dimensions();
102        let (offset_x, offset_y) = get_offsets(canvas_w, canvas_h);
103        let coeff = get_coeff(canvas_w, canvas_h);
104
105        
106        CanvasRenderingContext2D::clear_rect(0., 0., canvas_w, canvas_h);
107
108        let cell_width = 100.0 / self.width as f32;
109        let cell_height = 100.0 / self.height as f32;
110        let mut x_i = 0;
111        let mut y_i= 0;
112
113        for line in self.cells.as_slice().chunks(self.width as usize) {
114            for &cell in line {
115                if cell == Cell::Alive{
116                    let start_x = apply_transformation(x_i as f32 * cell_width, coeff, offset_x);
117                    let start_y = apply_transformation(y_i as f32 * cell_height, coeff, offset_y);
118
119
120                    CanvasRenderingContext2D::begin_path();
121                    CanvasRenderingContext2D::set_fill_style_rgba(200, 200, 200,255);
122                    CanvasRenderingContext2D::fill_rect(start_x, start_y,cell_width, cell_height);
123                }
124                
125                x_i += 1;
126            }
127            x_i = 0;
128            y_i += 1;
129        }
130    }
Source

pub fn line_to(x: f32, y: f32)

adds a straight line to the current sub-path by connecting the sub-path’s last point to the specified (x, y) coordinates. see CanvasRenderingContext2D.lineTo

§Parameters
  • ‘x’ - the x-axis coordinate of the line’s end point
  • ‘y’ - the y-axis coordinate of the line’s end point.
Examples found in repository?
examples/big-m.rs (line 35)
31fn local_line_to(x:f32, y:f32,x_offset:f32, y_offset: f32, coeff: f32) {
32   let local_x = apply_transformation(x, coeff, x_offset);
33   let local_y = apply_transformation(y, coeff, y_offset);
34
35   CanvasRenderingContext2D::line_to(local_x, local_y);
36}
More examples
Hide additional examples
examples/line-joins.rs (line 19)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/clear-rect.rs (line 23)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
examples/line-caps.rs (line 14)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn move_to(x: f32, y: f32)

begins a new sub-path at the point specified by the given (x, y) coordinates. see CanvasRenderingContext2D.moveTo

§Parameters
  • ‘x’ - the x-axis coordinate of the point
  • ‘y’ - the y-axis coordinate of the point.
Examples found in repository?
examples/big-m.rs (line 28)
24fn local_move_to(x:f32, y:f32,x_offset:f32, y_offset: f32, coeff: f32) {
25   let local_x = apply_transformation(x, coeff, x_offset);
26   let local_y = apply_transformation(y, coeff, y_offset);
27
28   CanvasRenderingContext2D::move_to(local_x, local_y);
29}
More examples
Hide additional examples
examples/line-joins.rs (line 18)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/clear-rect.rs (line 22)
9pub extern "C" fn draw(){
10
11    let height = CanvasRenderingContext2D::get_canvas_height();
12    let width = CanvasRenderingContext2D::get_canvas_width();
13
14   // draw yellow background
15   CanvasRenderingContext2D::begin_path();
16   CanvasRenderingContext2D::set_fill_style_rgba(255, 255, 102,255);
17   CanvasRenderingContext2D::fill_rect(0., 0.,width, height);
18   
19   // draw blue triangle
20   CanvasRenderingContext2D::begin_path();
21   CanvasRenderingContext2D::set_fill_style_rgba(0, 0, 255,255);
22   CanvasRenderingContext2D::move_to(20.,20.);
23   CanvasRenderingContext2D::line_to(180.,20.);
24   CanvasRenderingContext2D::line_to(130.,130.);
25   CanvasRenderingContext2D::close_path();
26   CanvasRenderingContext2D::fill();
27
28   // clear part of the canvas
29   CanvasRenderingContext2D::clear_rect(10., 10., 120., 120.);
30}
examples/line-caps.rs (line 13)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn stroke()

strokes (outlines) the current or given path with the current stroke style. see CanvasRenderingContext2D.stroke

§Parameters (none)
Examples found in repository?
examples/multi-color-circles.rs (line 16)
10pub extern "C" fn draw(){
11    for i in 0..6{
12        for j in 0..6 {
13            CanvasRenderingContext2D::set_stroke_style_rgba(0, (255. - 42.5 * i as f32).floor() as u8, (255.0 - 42.5 * j as f32).floor() as u8, 255);
14            CanvasRenderingContext2D::begin_path();
15            CanvasRenderingContext2D::arc(12.5 + (j * 25) as f32, 12.5 + (i * 25) as f32, 10., 0., PI * 2.0, true);
16            CanvasRenderingContext2D::stroke();
17        }
18    }
19}
More examples
Hide additional examples
examples/big-m.rs (line 21)
9pub extern "C" fn draw(){
10   let (x_offset, y_offset) = get_offsets();
11   let coeff = get_coeff();
12
13
14   local_move_to(5.,95.,x_offset,y_offset,coeff);
15   local_line_to(10.,15.,x_offset,y_offset,coeff);
16   local_line_to(50.,70.,x_offset,y_offset,coeff);
17   local_line_to(90.,15.,x_offset,y_offset,coeff);
18   local_line_to(95.,95.,x_offset,y_offset,coeff);
19
20   CanvasRenderingContext2D::set_line_width(15 * coeff.floor() as u32);
21   CanvasRenderingContext2D::stroke();
22}
examples/line-joins.rs (line 23)
9pub extern "C" fn draw(){
10    
11    // Draw Lines
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
13    CanvasRenderingContext2D::set_line_width(10);
14    let mut i = 0;
15    for join in LineJoin::iterator() {
16        CanvasRenderingContext2D::set_line_join(join);
17        CanvasRenderingContext2D::begin_path();
18        CanvasRenderingContext2D::move_to(-5.0, 5.0 + i as f32 * 40.);
19        CanvasRenderingContext2D::line_to(35.0, 45.0 + i as f32 * 40.);
20        CanvasRenderingContext2D::line_to(75.0, 5.0 + i as f32 * 40.);
21        CanvasRenderingContext2D::line_to(115.0, 45.0 + i as f32 * 40.);
22        CanvasRenderingContext2D::line_to(155.0, 5.0 + i as f32 * 40.);
23        CanvasRenderingContext2D::stroke();
24        i += 1;
25    }
26}
examples/line-caps.rs (line 17)
9pub extern "C" fn draw(){
10    // draw guides
11    CanvasRenderingContext2D::begin_path();
12    CanvasRenderingContext2D::set_stroke_style_rgba(0, 153, 255, 255);
13    CanvasRenderingContext2D::move_to(10., 10.);
14    CanvasRenderingContext2D::line_to(140., 10.);
15    CanvasRenderingContext2D::move_to(10., 140.);
16    CanvasRenderingContext2D::line_to(140., 140.);
17    CanvasRenderingContext2D::stroke();
18    
19    // Draw Lines
20    CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 0, 255);
21    let mut i = 0;
22    for cap in LineCap::iterator() {
23        CanvasRenderingContext2D::set_line_width(15);
24        CanvasRenderingContext2D::set_line_cap(cap);
25        CanvasRenderingContext2D::begin_path();
26        CanvasRenderingContext2D::move_to(25.0 + i as f32 * 50., 10.);
27        CanvasRenderingContext2D::line_to(25.0 + i as f32 * 50., 140.);
28        CanvasRenderingContext2D::stroke();
29        i += 1;
30    }
31}
Source

pub fn stroke_rect(x: f32, y: f32, width: f32, height: f32)

draws a rectangle that is stroked (outlined) according to the current strokeStyle and other context settings. see CanvasRenderingContext2D.strokeRect

§Parameters
  • ‘x’ - the x-axis coordinate of the rectangle’s starting point.
  • ‘y’ - the y-axis coordinate of the rectangle’s starting point.
  • ‘width’ - the rectangle’s width. Positive values are to the right, and negative to the left.
  • ‘height’ - the rectangle’s height. Positive values are down, and negative are up.
Examples found in repository?
examples/shadow-boxes.rs (line 20)
9pub extern "C" fn draw(){
10   CanvasRenderingContext2D::set_shadow_color_rgba(255, 0, 0, 204);
11   CanvasRenderingContext2D::set_shadow_blur(8);
12   CanvasRenderingContext2D::set_shadow_offset_x(30);
13   CanvasRenderingContext2D::set_shadow_offset_y(20);
14
15   CanvasRenderingContext2D::set_fill_style_rgba(0, 255, 0, 51);
16   CanvasRenderingContext2D::fill_rect(10., 10., 150., 100.);
17
18   CanvasRenderingContext2D::set_line_width(10);
19   CanvasRenderingContext2D::set_stroke_style_rgba(0, 0, 255, 153);
20   CanvasRenderingContext2D::stroke_rect(10.,10.,150.,100.);
21
22}

Auto Trait Implementations§

Blanket Implementations§

Source§

impl<T> Any for T
where T: 'static + ?Sized,

Source§

fn type_id(&self) -> TypeId

Gets the TypeId of self. Read more
Source§

impl<T> Borrow<T> for T
where T: ?Sized,

Source§

fn borrow(&self) -> &T

Immutably borrows from an owned value. Read more
Source§

impl<T> BorrowMut<T> for T
where T: ?Sized,

Source§

fn borrow_mut(&mut self) -> &mut T

Mutably borrows from an owned value. Read more
Source§

impl<T> From<T> for T

Source§

fn from(t: T) -> T

Returns the argument unchanged.

Source§

impl<T, U> Into<U> for T
where U: From<T>,

Source§

fn into(self) -> U

Calls U::from(self).

That is, this conversion is whatever the implementation of From<T> for U chooses to do.

Source§

impl<T, U> TryFrom<U> for T
where U: Into<T>,

Source§

type Error = Infallible

The type returned in the event of a conversion error.
Source§

fn try_from(value: U) -> Result<T, <T as TryFrom<U>>::Error>

Performs the conversion.
Source§

impl<T, U> TryInto<U> for T
where U: TryFrom<T>,

Source§

type Error = <U as TryFrom<T>>::Error

The type returned in the event of a conversion error.
Source§

fn try_into(self) -> Result<U, <U as TryFrom<T>>::Error>

Performs the conversion.