Question

我试图在wordpress编辑器中绘制画布。在＆＃34; Pages＆＃34;使用我的插件的自定义按钮，我可以使用：

添加画布

wp.media.editor.insert('<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">canvas test </canvas>');

但是当我试图在画布上画一些东西时，它不起作用。

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.font = "30px Georgia";
ctx.fillText("test", 90, 50);

我不确定为什么它无法找到画布以便绘制它。

Answer 1

也许这个插件对你有用。

https://wordpress.org/plugins/wc-shortcodes/

请试试。

Answer 2

好的，所以我找到了正确的方法。

编辑器＆＃34; Pages＆＃34;和＆＃34;帖子＆＃34;在iframe中。所以这是在画布中访问和绘制的方式：

    var iframe = document.getElementById('content_ifr');
    var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
    var canvas = innerDoc.getElementById('myCanvas');
    var ctx = canvas.getContext("2d");
    ctx.font = "30px Georgia";
    ctx.fillText("test", 90, 50);

如何在wordpress编辑器中绘制画布

2 个答案: