fabric.js Padding

by tinyhustlee

HTML

<script src="https://rawgithub.com/kangax/fabric.js/master/dist/fabric.js"></script>
<canvas id="c" width="600" height="600"></canvas>

CSS

canvas {
    border: 1px solid #999;
}
img {
    display: none;
}

JavaScript

/**
 * fabric.js template for bug reports
 *
 * Please update the name of the jsfiddle (see Fiddle Options).
 * This templates uses latest dev verison of fabric.js (https://rawgithub.com/kangax/fabric.js/master/dist/all.js).
 */

// initialize fabric canvas and assign to global windows object for debug
var canvas = window._canvas = new fabric.Canvas('c');

// Do some initializing stuff
fabric.Object.prototype.set({
    transparentCorners: false,
    cornerColor: 'rgba(102,153,255,0.5)',
    cornerSize: 12,
    padding: 7
});

// ADD YOUR CODE HERE
var iText1 = new fabric.IText('Padding 7', {
    fontFamily: 'Arial',
    left: 100,
    top: 200,
    fill: "#000000",
    stroke: "#000000",
    strokeWidth: 2
});
var iText2 = new fabric.IText('Padding 0', {
    fontFamily: 'Arial',
    padding: 0,
    left: 300,
    top: 200,
    fill: "#000000",
    stroke: ""
});
canvas.add(iText1, iText2);