Django模板标记+使用fabric.js
Django模板标记+使用fabric.js
提问于 2017-09-16 10:42:34
我已经建立了一个合理的Django站点来测试和玩，但是包括fabric.js在内，我过得很糟糕
最后，我想使用fabric.js从数据库中获取小图像，并将它们显示在画布上，但我偏离了主题。
我遇到的问题是，我不能使用fabric.js在我的html中使用本地png映像--我的意思是，包含了fabric (因为我可以对fabric做非常基本的技巧，比如创建矩形)，但是，本教程不清楚如何包含本地图像。
这是我可怕的密码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>This is using render</title>
{% load staticfiles %}
<script scr="{% static "js/fabric.js" %}" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
var canvas = new fabric.Canvas('c');
canvas.setHeight(480);
canvas.setWidth(640);
var imgElement = fabric.Image.fromURL('../static/images/pitch.png', function(oImg) {
canvas.add(oImg);
});
var imgInstance = new fabric.Image(imgElement, {
left: 100,
top: 100,
angle: 90,
opacity: 0.85
});
canvas.add(imgInstance);
</script>
</body>
</html>可能做了些粗俗的事，所以提前道歉。
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-09-16 10:54:22
在HTML中添加一个图像元素(并按id获取)，而不是使用fabric.Image.fromURL()加载它
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>This is using render</title> {% load staticfiles %}
<script src="{% static "js/fabric.js" %}" type="text/javascript"></script>
</head>
<body>
<canvas id="c"></canvas>
<img id="imgElement" src="../static/images/pitch.png" hidden>
<script type="text/javascript">
var canvas = new fabric.Canvas('c');
canvas.setHeight(480);
canvas.setWidth(640);
var imgInstance = new fabric.Image(imgElement, {
left: 100,
top: 100,
angle: 90,
opacity: 0.85
});
canvas.add(imgInstance);
</script>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46252979
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号