SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Jan 2014
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    What is HTML5 canvas?

    Whats the use of HTML5 canvas and how important is it for a web developer to have knowledge about it? Just wondering. I'm happy learning to code but canvas appears to be more about design and I suck at drawing and creating designs.

  2. #2
    SitePoint Addict bronze trophy
    Join Date
    Sep 2005
    Posts
    323
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    I've mostly used it for creating HTML5 games but there are other uses. I doubt you will need to use it much for designing websites, but it can be good for interactive elements and using JavaScript with it.

  3. #3
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Canvas is a graphic area ( not to be confused with a FIGURE or IMG). Think of it as sort of like FLASh but without having to import a FLASH file. The contents can be controlled, animated, etc using javascript .

    example:

    Code:
     <canvas id="myCanvas"></canvas>
    
    <script>
    var canvas=document.getElementById('myCanvas');
    var ctx=canvas.getContext('2d');
    ctx.fillStyle='#FF0000';
    ctx.fillRect(0,0,80,100);
    </script>
    hope that helps

  4. #4
    Non-Member
    Join Date
    May 2014
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The <canvas> element is used to draw graphics on a web page via scripting like javascript.
    canvas is used for drawing paths, boxes, circles, text, and adding images.

    syntax:
    <canvas id="draw" width="350" height="200"></canvas>
    and then adding the script coding for drawing circle.

    if you want know more about <canvas> look at w3schools html5 tutorial.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •