konva.js 工具类

原创

已于 2024-04-19 11:27:24 修改 · 642 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #swift #开发语言

于 2024-04-15 09:13:09 首次发布

konva.js 工具类

import StringUtils from "./StringUtil.js";

class KonvaCanvas {
   
   
	/**
	 * 初始化画布
	 * @param {String} domId 容器dom id
	 */
	constructor(domId) {
   
   
		this.layer = null;
		this.stage = null;
		this.scale = 1.0;

		this.init(domId);
	}

	/**
	 * 聚焦到指定元素
	 * @param {String} elementId 元素dom id
	 */
	focusOn(elementId) {
   
   
		if (!this.layer || !this.stage || !elementId) return;
		var element = this.stage.find("#" + elementId)[0];

		let element_x = StringUtils.isNumeric(element.position().x) ? element.position().x : Number(element.position().x);
		let element_y = StringUtils.isNumeric(element.position().y) ? element.position().y : Number(element.position().y);

		let halfStageWidth = this.stage.width() * 0.5;
		let halfStageHeight = this.stage.height() * 0.5;

		let x = 0;
		let y = 0;
		if (element_x < 0) {
   
   
			x = Math.abs(element_x - halfStageWidth);
		} else {
   
   
			x = halfStageWidth - element_x;
		}

		if (element_y < 0) {
   
   
			y = Math.abs(element_y - halfStageHeight);