JSFiddle - React, Tailwind, and code Playground

by fahadnabbasi

HTML

<script src="http://fabricjs.com/lib/fabric.js"></script>
<canvas id="c" width="400" height="400"></canvas>
<button type="button" id="format">Apply Formatting</button>
<button type="button" id="leftAlign">Left align</button>
<button type="button" id="rightAlign">Right align</button>
<button type="button" id="centerAlign">Center align</button>

CSS

#c {
    border:0px solid #ccc;
    background: #cccccc
}

JavaScript

var canvas = new fabric.Canvas("c");
var text = new fabric.Textbox('Hellow wordld is a  textbox in one line', {
            width:250
        });
canvas.add(text)
$('#zoomin').on('click', function () {
    var zoom = canvas.getZoom()+0.125;
    canvas.setZoom(zoom);
});