问题标签 [konvajs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1942 浏览

javascript - 如何将 konvaJS 中的文本值拉伸到一定的宽度和高度?

在 KonvaJS Text Object 中有一个类似fontSizefontSize: 30的属性,但我需要根据我给它的宽度和高度来拉伸文本。

这是我写的:

你有什么建议让代码工作?

0 投票
1 回答
1663 浏览

javascript - 克隆后无法访问 Konva Stage 的子级

我对 konvajs 有疑问。我有一个 konva Stage,我克隆到一个临时 Stage,所以当用户取消时,我可以恢复用户所做的更改。我这样做的方法是,我将现有 Stage 克隆为临时 Stage,销毁原始 Stage 的子级,然后将临时 Stage 的子级移回原始 Stage 并销毁临时 Stage。问题是,当我现在尝试访问孩子时,例如通过 findOne('#id-of-child'),我得到未定义,即使孩子存在。

这是我到目前为止所做的:

现在,当用户打开工具箱进行更改时,当前阶段将使用“克隆”功能进行克隆,当用户取消更改时,将使用克隆的阶段作为参数调用“恢复”功能。但是在那之后,当我尝试执行以下操作时,它们并没有按预期工作。

但是“some_child_of_the_stage”确实存在并且当然有一个层,并且舞台有一个id为“edit-layer”的孩子。

我和我的同事都束手无策了。

我感谢任何帮助和建议,谢谢。

更新: 通过 console.log 显示问题的简短小提琴: 小提琴

0 投票
1 回答
2149 浏览

javascript - KonvaJS:从中心缩放图像

在扩展Konva.Image. 我想从它的中心点缩放图像。虽然我可以从中心缩放它,但我不确定这是否是正确的做法。目前它是从它的top-left角落缩放的。要从中心点缩放图像,我offset使用image.setOffset(). 但我不知道为什么它会移动图像。我正在这样做:

要缩放图像,我正在这样做:

有没有其他方法可以达到同样的效果?这是玩的plunkr

0 投票
1 回答
1900 浏览

javascript - 画布内容作为高分辨率图像。

我在我的项目中使用KonvaJS。我需要将其另存stage/canvas为图像(如果导出的图像是高分辨率图像,那就太好了)。KonvaJS有一个名为stage.toDataURL()的函数,它将画布内容作为 Base64 字符串返回。这个函数的挑战在于它只返回画布的可见区域。我需要将整个画布导出为图像,而不仅仅是它的可见区域。我尝试使用Canvas2Image但它也只保存可见区域而不是完整的画布。有什么办法可以实现吗?这是一个玩一些 poc(概念证明)代码的plunkr 。

0 投票
1 回答
836 浏览

javascript - Konvajs 集团高亮带边框

我有 2 组,每组内都有圆形或矩形。我需要在单击时突出显示该组,并带有边框,以便用户知道哪个组处于活动状态。

0 投票
1 回答
216 浏览

javascript - 使用 Konva 验证 HTML 数字输入中的值

我正在开发一个可以使用 konva 绘制图形的网站,但我目前遇到了这个奇怪的问题:

如果我将每个刻度的单位更改为整数以外*.5的任何值,它将变成这样:

在此处输入图像描述

这是代码:

https://codepen.io/ItsTheWolf/pen/jrdkNX

如果有帮助,这里是 HTML5 代码:

另外,有没有办法检查输入中的值type = "number"是空的还是奇怪的(比如用户输入时0-5)然后设置err = 1?我尝试了类似的东西minx === nullminx.length === 0但它不起作用。

0 投票
1 回答
1135 浏览

javascript - 在 Konva js 上设置图层宽度

在 KnovaJS 上,如何设置图层的宽度和高度?

http://konvajs.github.io/api/Konva.Layer.html

我试过了:

只有 x 和 y 属性有效。

0 投票
1 回答
101 浏览

javascript - 在 KonvaJS 中,如何按比例批量调整组中所有项目的大小?

在 KonvaJS 中,可以旋转组中的所有元素,例如:

this指组对象)

现在,如果我尝试调整宽度/高度,它将不起作用。

0 投票
1 回答
708 浏览

javascript - 画布上的触摸事件并不总是在 ipad / iOS10 上正确触发

我在使用 iOS 10 的 ipad air 上使用 Web 应用程序时遇到了奇怪的触摸行为,有时在画布上绘制的对象上的事件不会触发。

为了缩小问题范围,我创建了一个简单的测试用例,在画布上绘制了 25 个矩形,每个矩形都附加了一个事件处理程序。现在,当我点击矩形时,有些不会触发事件,因此事件处理程序中的代码永远不会执行。总是至少有 1 或 2 个矩形行为不正常(大多数情况下更多),并且每次重新加载时受影响的矩形都会发生变化。

底层 div 上的处理程序总是触发一个触摸事件。

当我有更复杂的设置时,有时事件会在底层注册。但同样,仅适用于少数人矩形。

我使用 Konva.js 作为库(之前使用的是 kineticjs,同样的行为)。

这是我的代码:

产生这个简单的例子:

在此处输入图像描述

矩形左上角是 0,0,右下角是 5,5。在触摸时,每个矩形都应该记录它的标识符,但有些人只是不想触发 touchend 事件(并且在我重新加载页面之前它们不会触发,然后随机选择其他矩形进行故障...)。

我在这里有一个codepen:http: //codepen.io/destiny84/pen/PWYbeO

现在这是自 iOS 10 以来 AppleWebKit 上的一个已知错误吗?或者我在这里错过了什么?

0 投票
0 回答
140 浏览

html - 我想使用 konva 库进行拖放

我想使用 konva 库进行拖放,但主要是如果我上传大尺寸的图像,我想要固定的拖动部分,然后额外的尺寸将隐藏并且图像仅显示为可见部分在此处输入图像描述

我希望如果我上传适合此框架的图像,并且如果上传的图像更大,我可以拖放或仅在该部分内调整大小,然后该部分将隐藏额外的部分。