HTML5 Game Development by Example(Second Edition)

Summary

You learned a lot in this chapter about drawing shapes and creating interaction with the new HTML5 canvas element and the drawing API.

Specifically, you learned to draw circles and lines in the Canvas. We added mouse events and touch dragging interaction with the paths drawn in the Canvas. We determined line intersection with the help of mathematics formulas. We separated a complex code logic into different files to make the code maintainable. We divided the logic into data, drawing, and inputs.

Now that you've learned about basic drawing functions in the Canvas and the drawing API, you're ready to learn some advanced drawing techniques in Canvas. In the next chapter, we will create a puzzle solving game by continuing the code example. You ...