Danmakanvas

Welcome to my Danmakanvas information page!

What is Danmakanvas?

Danmakanvas is a lightweight danmaku engine built in JavaScript (for HTML5 Canvas) that is embedded within this website's tutorials to provide visual examples of danmaku patterns. It provides bullets, as well as simulated tasks and Single scripts.

Danmakanvas was first written May-June 2016 (v1) and was, to be frank, OK at best, with a plethora of SetInterval problems and limited usage. However, in January 2018, this old project was slightly rewritten and added to this website (v2) in a form that was usable... if there was only one canvas per page. In April-May 2018, Danmakanvas was rewritten to allow for multiple canvases on the same webpage. In October 2019, Danmakanvas was shifted to a strong prototyping role for danmaku pattern visualization and was granted its own repository.

Embedding in other websites

WARNING: Danmakanvas may break at any time. We recommend using the latest stable version. In addition, if any bugs are discovered, please report them.

Interested in using Danmakanvas on your website? Here's how!

First, visit the repository. If there are releases available, we suggest downloading these.

The release is a standalone library. You can include it as a script in any HTML file.

<script src="path/to/Danmakanvas.js"></script>

To place a canvas, do the following:

<canvas id="gamecanvas_1" width="384" height="448" style="border:1px solid #DDDDDD;">
</canvas>
<button type="button" onclick="createNewGame('gamecanvas_1', 'String to display')">Run Danmakanvas Simulation</button>

The ID of the canvas DOM element should match the id passed as a parameter to createNewGame(). By default, whatever string is used for 'String to display' will be displayed in the top left of the canvas.

Note that the background color of the canvas is not specified in the JavaScript file and will default to whatever background the canvas is laid onto.

Additionally, note that you do not need to use a button to trigger the canvas - you can call the createNewGame() function wherever you want.

For more information, refer to the repository's README.