我正在使用 PHP 开发餐厅管理 Web 应用程序。
在这个应用程序中,我想创建表格的平面布局,这意味着管理员可以从左侧拖放表格并在右侧创建餐厅的布局,并将布局和表格详细信息存储在数据库中。
我正在使用 Yii2 框架。
为此,我创建了可拖动的 Canvas 标签,但我如何从 Canvas 获取输入?
我的 Canvas 标签:
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;" value="4"></canvas>
J查询:
$(function() {
$( "#myCanvas" ).draggable();
});
我已经按照上面的方法试过了。我不知道天气是否正确。
请给我一些想法,我怎样才能做这个可拖动的 Canvas 输入表单,它将表格的详细信息保存到我的数据库中。
最佳答案
您可以在 Canvas 中定义具有边界的区域。最简单的方法是注意元素周围的矩形/圆形。通过单击给定位置,您将了解 x、y 值,如果您知道形状的不等式,则您将能够确定哪个形状包含您单击的点。在我们的例子中,由于您想使用拖动,因此您会感兴趣的事件是:
在这些事件中,您将能够找出拖动开始的点和拖动结束的点,因此,您将能够确定初始 Canvas 中的哪个元素包含该点拖动开始的位置以及应该在目标 Canvas 中创建元素的位置。但是最好能以图形方式显示拖动,为此您可以创建一个容器,其中将填充您需要的图像并随光标一起移动。您可以通过创建一个可移动容器来实现这一点,该容器将在 ondragstart 上可视化,在 ondrag 上移动并在 ondragend 上隐藏。
关于php - 制作可以从 HTML 表单输入的可拖动元素(圆形、矩形等形状),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55921776/