/** * A veritical line sprite. The x and y configs set the center of the line with the size * value determining the height of the line (the line will be twice the height of 'size' * since 'size' is added to above and below 'y' to set the line endpoints). * * @example * Ext.create({ * xtype: 'draw', * renderTo: document.body, * width: 600, * height: 400, * sprites: [{ * type: 'tick', * x: 20, * y: 40, * size: 10, * strokeStyle: '#388FAD', * lineWidth: 2 * }] * }); */Ext.define('Ext.draw.sprite.Tick', { extend: 'Ext.draw.sprite.Line', alias: 'sprite.tick', inheritableStatics: { def: { processors: { /** * @cfg {Object} x The position of the center of the sprite on the x-axis. */ x: 'number', /** * @cfg {Object} y The position of the center of the sprite on the y-axis. */ y: 'number', /** * @cfg {Number} [size=4] The size of the sprite. * Meant to be comparable to the size of a circle sprite with the same radius. */ size: 'number' }, defaults: { x: 0, y: 0, size: 4 }, triggers: { x: 'tick', y: 'tick', size: 'tick' }, updaters: { tick: function(attr) { var size = attr.size * 1.5, halfLineWidth = attr.lineWidth / 2, x = attr.x, y = attr.y; this.setAttributes({ fromX: x - halfLineWidth, fromY: y - size, toX: x - halfLineWidth, toY: y + size }); } } } } });