JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://draw2d.org/draw2d_touch/jsdoc/draw2d/examples/code_snippets/shape/css/example.css">
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/shifty.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/raphael.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/jquery-1.10.2.min.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/jquery.autoresize.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/jquery-touch_punch.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/jquery.contextmenu.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/rgbcolor.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/canvg.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/Class.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/json2.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc/draw2d/lib/pathfinding-browser.min.js"></script>
<script src="http://draw2d.org/draw2d_touch/jsdoc_5/draw2d/src/draw2d.js"></script>
<div id="canvas"></div>
JavaScript
draw2d.shape.node.Rectangle = draw2d.shape.basic.Rectangle.extend({
NAME : "draw2d.shape.node.Rectangle",
DEFAULT_COLOR : new draw2d.util.Color("#4D90FE"),
init: function(attr, setter, getter)
{
var attr = $.extend({width: 180, height: 50}, attr);
this.label = null;
this._super(attr, setter, getter);
this.label = new draw2d.shape.basic.Label({text:"Label"});
this.container = new draw2d.shape.layout.VerticalLayout();
this.container.add(this.label);
this.add(this.container, new draw2d.layout.locator.CenterLocator());
this.leftContainer = new draw2d.shape.layout.VerticalLayout();
this.rightContainer = new draw2d.shape.layout.VerticalLayout();
this.bottomContainer = new draw2d.shape.layout.HorizontalLayout();
this.bottomContainer.add(this.leftContainer);
this.bottomContainer.add(this.rightContainer);
this.container.add(this.bottomContainer);
},
setText: function (text) {
this.label.setText(text);
this.setDimension(this.width, this.height);
},
getMinWidth: function () {
if (this.label === null) {
return this._super();
}
return Math.max(this._super(), this.label.getWidth());
}
});
console.log(this);
var canvas = new draw2d.Canvas("canvas");
canvas.add(new draw2d.shape.node.Rectangle, 50, 50);