How to use the konva.Container function in konva

To help you get started, we’ve selected a few konva examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github konvajs / react-konva / src / react-konva.js View on Github external
var ReactInstanceMap = require('react-dom/lib/ReactInstanceMap');
var ReactMultiChild = require('react-dom/lib/ReactMultiChild');
var ReactUpdates = require('react-dom/lib/ReactUpdates');

var assign = require('object-assign');
var emptyObject = require('fbjs/lib/emptyObject');

// some patching to make Konva.Node looks like DOM nodes
var oldAdd = Konva.Container.prototype.add;
Konva.Container.prototype.add = function(child) {
  child.parentNode = this;
  oldAdd.apply(this, arguments);
};

Konva.Container.prototype.replaceChild = function(newChild, oldChild) {
  var index = oldChild.index;
  var parent = oldChild.parent;
  oldChild.destroy();
  oldChild.parentNode = null;
  parent.add(newChild);
  if (newChild.index !== index) {
    newChild.setZIndex(index);
  }
  parent.getLayer().batchDraw();
};

function createComponent(name) {
  var ReactKonvaComponent = function(element) {
    this.node = null;
    this.subscriptions = null;
    this.listeners = null;
github konvajs / react-konva / src / react-konva.js View on Github external
var ReactInstanceMap = require('react/lib/ReactInstanceMap');
var ReactMultiChild = require('react/lib/ReactMultiChild');
var ReactUpdates = require('react/lib/ReactUpdates');

var assign = require('object-assign');
var emptyObject = require('fbjs/lib/emptyObject');


// some patching to make Konva.Node looks like DOM nodes
var oldAdd = Konva.Container.prototype.add;
Konva.Container.prototype.add = function(child) {
  child.parentNode = this;
  oldAdd.apply(this, arguments);
}

Konva.Container.prototype.replaceChild = function(newChild, oldChild) {
  var index = oldChild.index;
  var parent = oldChild.parent;
  oldChild.destroy();
  oldChild.parentNode = null;
  parent.add(newChild);
  if (newChild.index !== index) {
    newChild.setZIndex(index);
  }
  parent.getLayer().batchDraw();
}




function createComponent(name) {
  var ReactKonvaComponent = function(element) {
github konvajs / react-konva / src / react-konva.js View on Github external
// Adapted from ReactART:
// https://github.com/reactjs/react-art

var Konva = require('konva');
var React = require('react/lib/React');

var ReactInstanceMap = require('react/lib/ReactInstanceMap');
var ReactMultiChild = require('react/lib/ReactMultiChild');
var ReactUpdates = require('react/lib/ReactUpdates');

var assign = require('object-assign');
var emptyObject = require('fbjs/lib/emptyObject');


// some patching to make Konva.Node looks like DOM nodes
var oldAdd = Konva.Container.prototype.add;
Konva.Container.prototype.add = function(child) {
  child.parentNode = this;
  oldAdd.apply(this, arguments);
}

Konva.Container.prototype.replaceChild = function(newChild, oldChild) {
  var index = oldChild.index;
  var parent = oldChild.parent;
  oldChild.destroy();
  oldChild.parentNode = null;
  parent.add(newChild);
  if (newChild.index !== index) {
    newChild.setZIndex(index);
  }
  parent.getLayer().batchDraw();
}
github konvajs / react-konva / src / react-konva.js View on Github external
var Konva = require('konva');
var React = require('react/lib/React');

var PropTypes = require('prop-types');
var createClass = require('create-react-class');

var ReactInstanceMap = require('react-dom/lib/ReactInstanceMap');
var ReactMultiChild = require('react-dom/lib/ReactMultiChild');
var ReactUpdates = require('react-dom/lib/ReactUpdates');

var assign = require('object-assign');
var emptyObject = require('fbjs/lib/emptyObject');

// some patching to make Konva.Node looks like DOM nodes
var oldAdd = Konva.Container.prototype.add;
Konva.Container.prototype.add = function(child) {
  child.parentNode = this;
  oldAdd.apply(this, arguments);
};

Konva.Container.prototype.replaceChild = function(newChild, oldChild) {
  var index = oldChild.index;
  var parent = oldChild.parent;
  oldChild.destroy();
  oldChild.parentNode = null;
  parent.add(newChild);
  if (newChild.index !== index) {
    newChild.setZIndex(index);
  }
  parent.getLayer().batchDraw();
};

konva

<p align="center"> <img src="https://konvajs.org/android-chrome-192x192.png" alt="Konva logo" height="180" /> </p>

MIT
Latest version published 4 days ago

Package Health Score

84 / 100
Full package analysis