Published
Edited
Apr 8, 2021
1 fork
1 star
Insert cell
Insert cell
Insert cell
html`
<canvas id="kb"></canvas>
`
Insert cell
kaboom = require('kaboomjs@0.1.0/src/kaboom.js').catch(() => window["kaboom"])
Insert cell
{
kaboom.init({
width: 480, // width of canvas
height: 480, // height of canvas
canvas: document.getElementById("kb"),
});
kaboom.loadSprite("mark", await FileAttachment("download (3).png").url() );
// define a scene
kaboom.scene("main", () => {
const mark = kaboom.add([
kaboom.sprite("mark"),
kaboom.pos(kaboom.width() / 2, kaboom.height() / 2),
kaboom.scale(10),
kaboom.rotate(0),
kaboom.origin("center"),
]);

// add a text at position (100, 100)
kaboom.add([
kaboom.text("oh hi Kaboom!", 32),
kaboom.pos(50, 100),
]);

mark.action(() => {
mark.scale = Math.sin(kaboom.time()) * 10;
mark.angle += kaboom.dt();
});
});
// start the game
kaboom.start("main");
}
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more