Package Exports
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (holst) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Holst is 2D Graphic library
<canvas id="canvas" width="300" height="300"></canvas>
<script>
import { Scene, Renderer2D, Color } from 'holst'
const scene = new Scene()
const layer = scene.createLayer()
const shape = layer.createShape({ fill: Color.blue }).circle({ x: 150, y: 150 }, 50)
const animation = scene.createAnimation({ duration: 500 })
animation.action = ({ t }) => shape.style.fill = Color.fromGradient(t, [Color.blue, Color.red])
animation.finish = () => shape.style.fill = Color.blue
shape.on('click', () => animation.start())
const canvas = document.getElementById('canvas')
const renderer = new Renderer2D(canvas.getContext('2d')!!)
renderer.render(scene)
</script>
Documentation
Demo project list
- getpalette - The demo is how extract unique colors from an uploaded image and make from those colors palette (see live)
- sprites - shows sprites animation
- relative-draw - test for draw in the relative coordinate
- colors - test for how works colors
- block-scheme-editor - block scheme editor
- chart3
- paint
- viewport - The demo shows the viewport with a scroll box and gives the opportunity to move and/or scale the scene
- movement - The demo shows shapes moving using matrix transform method