bigbluebutton-Github/bbb-export-annotations/shapes/ArrowDown.js

44 lines
1002 B
JavaScript

import {Polygon as SVGPolygon} from '@svgdotjs/svg.js';
import {Geo} from './Geo.js';
/**
* Creates an SVG down-arrow shape.
*
* @class ArrowDown
* @extends {Geo}
*/
export class ArrowDown extends Geo {
/**
* Draws a down arrow shape on the SVG canvas.
* @return {G} Returns the SVG group element containing the down arrow.
*/
draw() {
const w = this.w;
const h = this.h + this.growY;
const ox = w * 0.16;
const oy = Math.min(w, h) * 0.38;
const points = [
[ox, 0],
[w - ox, 0],
[w - ox, h - oy],
[w, h - oy],
[w / 2, h],
[0, h - oy],
[ox, h - oy],
].map(([x, y]) => `${x},${y}`).join(' ');
const arrowGroup = this.shapeGroup;
const arrow = new SVGPolygon();
arrow.plot(points)
.stroke({color: this.shapeColor, width: this.thickness})
.style({dasharray: this.dasharray});
this.setFill(arrow);
arrowGroup.add(arrow);
this.drawLabel(arrowGroup);
return arrowGroup;
}
}