Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
59 lines (49 sloc) 1.7 KB
import { Box, IBoundingBox, IRect } from '../classes';
import { getContext2dOrThrow } from '../dom/getContext2dOrThrow';
import { AnchorPosition, DrawTextField, DrawTextFieldOptions, IDrawTextFieldOptions } from './DrawTextField';
export interface IDrawBoxOptions {
boxColor?: string
lineWidth?: number
drawLabelOptions?: IDrawTextFieldOptions
label?: string
}
export class DrawBoxOptions {
public boxColor: string
public lineWidth: number
public drawLabelOptions: DrawTextFieldOptions
public label?: string
constructor(options: IDrawBoxOptions = {}) {
const { boxColor, lineWidth, label, drawLabelOptions } = options
this.boxColor = boxColor || 'rgba(0, 0, 255, 1)'
this.lineWidth = lineWidth || 2
this.label = label
const defaultDrawLabelOptions = {
anchorPosition: AnchorPosition.BOTTOM_LEFT,
backgroundColor: this.boxColor
}
this.drawLabelOptions = new DrawTextFieldOptions(Object.assign({}, defaultDrawLabelOptions, drawLabelOptions))
}
}
export class DrawBox {
public box: Box
public options: DrawBoxOptions
constructor(
box: IBoundingBox | IRect,
options: IDrawBoxOptions = {}
) {
this.box = new Box(box)
this.options = new DrawBoxOptions(options)
}
draw(canvasArg: string | HTMLCanvasElement | CanvasRenderingContext2D) {
const ctx = getContext2dOrThrow(canvasArg)
const { boxColor, lineWidth } = this.options
const { x, y, width, height } = this.box
ctx.strokeStyle = boxColor
ctx.lineWidth = lineWidth
ctx.strokeRect(x, y, width, height)
const { label } = this.options
if (label) {
new DrawTextField([label], { x: x - (lineWidth / 2), y }, this.options.drawLabelOptions).draw(canvasArg)
}
}
}
You can’t perform that action at this time.