📜JavaScript developer.
🐲RPG fan.
📚Storyteller and 🕹game developer.
👨Father and Husband.
Published
Edited
May 12, 2022
1 fork
1 star
Hello, Smart Shape!Hello, messagepipe!Hello, Atomico!Hello, Markdown-Tag !Hello, js-sdl!Hello Trivia API!Hello auto-animate!Hello, papa parse!Hello, lazy.js!Hello, mout!Hello, sugar js!Hello, lil-gui!Hello, owoify-js!Hello, Maverick JS -> Observables!Hello, Canvas Confetti!Hello, OWL!Hello, Bunny Fonts!Hello Color JS!Hello, Kute.js !Hello Color Legend Element!Hello, is-online!Hello, pretty-ms!Hello, Liveblocks!Convex ChatHello, filesize.js!Hello, SVG.jsHello, Counter-element!Hello, Ramda!Hello, Block Protocol!Hello, Reef!Hello, Croquet!Hello, Markdoc!Hello, Multiavatar!Hello, Tableful!Hello, kdl-jsHello, Wild Wild Path!Hello, Lexical!Hello, Statery!Hello, pdfme!Shuffle an ArrayHello, PikasoHello, Miniplex!Hello, CandyGraph!Hello, Supabase!Hello, Embla Carousel!Hello, core-js!Hello, tinybaseHello, umbrellajsHello, pintoraSkypack PixijsHello, sortablejsHello, JS-YAMLTesting bitECS for TempestHello jService!Hello, iro.jsHello, SplideHello, Cosmic JSHello, singuiKaboom JS TemplateHello, JSPDFHello, Awesome Dev JokesRandom DAD JokeHello, model-viewerThe OracleTarot UtilitiesHello, lokiJSHello, cash ( cash-dom )Hello, Dice RollerHello, Slide-ElementHello, tsParticlesKaboom - dynamic valuesHello Lit.devHello Kontra
Hello, Melon JS
Melon = import("https://cdn.skypack.dev/melonjs@10.7.1")
{
// create an HTML parent element that MelonJS will insert the canvas into.
yield html`<div id="melonparent"></div>`
Melon.device.onReady(()=>{
// initialize the display canvas once the device/browser is ready
if (!Melon.video.init(1218, 562, {parent : "melonparent", scale : "auto"})) {
alert("Your browser does not support HTML5 canvas.");
return;
}
// add a gray background to the default Stage
Melon.game.world.addChild(new Melon.ColorLayer("background", "#202020"));
// add a font text display object
Melon.game.world.addChild(new Melon.Text(609, 281, {
font: "Arial",
size: 160,
fillStyle: "#FFFFFF",
textBaseline : "middle",
textAlign : "center",
text : "Hello World !"
}));
}
)
}
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.
