Congratulations! You finished the Canvas tutorial ! This knowledge will help you to make great 2D graphics on the web.

More examples and tutorials

There are a variety of demos and further explanations about canvas on these sites:

Codepen.io

Front End Developer Playground & Code Editor in the Browser.

HTML5 Canvas Tutorials

Examples for most canvas APIs.

Game development

Gaming is one of the most popular computer activities. New technologies are constantly arriving to make it possible to develop better and more powerful games that can be run in any standards-compliant web browser.

Other Web APIs

These APIs might be useful when working further with canvas and graphics:

WebGL

Advanced API for rendering complex graphics, including 3D.

SVG

Scalable Vector Graphics let you describe images as sets of vectors (lines) and shapes in order to allow them to scale smoothly regardless of the size at which they're drawn.

Web Audio

The Web Audio API provides a powerful and versatile system for controlling audio on the Web, allowing developers to choose audio sources, add effects to audio, create audio visualizations, apply spatial effects (such as panning)  and much more.

Questions

堆栈溢出

Questions tagged with "canvas".

Comments about this tutorial – the MDN documentation community

If you have any comments about this tutorial or want to thank us, feel free to reach out to us!


元数据

  1. 画布 API
  2. Canvas tutorial
    1. 基本用法
    2. Drawing shapes
    3. Applying styles and colors
    4. 绘制文本
    5. Using images
    6. Transformations
    7. Compositing and clipping
    8. Basic animations
    9. Advanced animations
    10. Pixel manipulation
    11. Hit regions and accessibility
    12. Optimizing the canvas
    13. Finale
  3. 范例
    1. A basic raycaster
    2. Canvas code snippets
    3. Manipulating video using canvas
  4. 接口
    1. HTMLCanvasElement
    2. CanvasRenderingContext2D
    3. CanvasGradient
    4. CanvasPattern
    5. ImageBitmap
    6. ImageData
    7. TextMetrics
    8. Path2D
  5. 文档编制:
  6. 有用清单
    1. Pages tagged "Canvas"
  7. 贡献
    1. Canvas doc status
    2. MDN 工程