Get started with kineticjs CDN

MIT licensed

KineticJS is a library for creating and manipulating interactive HTML5 canvas graphics.

Tags:
  • html5
  • canvas

Stable version

Copied!

How to start using kineticjs CDN


// Include the KineticJS library
const script = document.createElement('script');
script.src = 'https://cdn.cdnhub.io/kineticjs/5.2.0/kinetic.min.js';
document.head.appendChild(script);

// Wait for the library to load before continuing
window.onload = function() {
  const stage = new Kinetic.Stage({
    container: 'container', // The HTML element that will contain the stage
    width: 400,
    height: 400
  });

  // Create a new circle shape with a radius of 50 pixels
  const circle = new Kinetic.Circle({
    x: 200,
    y: 200,
    radius: 50,
    fill: 'red'
  });

  // Add the shape to the stage
  stage.add(circle);

  // Listen for window resize events and update the stage size accordingly
  window.addEventListener('resize', function() {
    stage.container.width = stage.getWidth();
    stage.container.height = stage.getHeight();
  });
};
Copied!
Copied!

All versions