从表单输入中绘制画布形状

时间:2019-04-23 22:35:12

标签: php html database canvas input

我正在用表格构建网站,客户可以设计自己的标志,输出将是产品的产品代码,产品价格和形状,但是在另一个页面中,我的问题是我无法使用pr输入的数据在结果页面中,用户将输入高度,宽度,行数和列数,并且必须在用户在php中输入时绘制画布形状。

来自THIS PAGE,单击提交后,结果页面显示

[my-custom-table]->一个我用来导入在表单页面中输入的数据用户的插件

<canvas id="canvas" style="border: 2px solid black;" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var data = "<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'>" +
             "<foreignObject width='100%' height='100%'>" +
               "</p>
<div xmlns='http://www.w3.org/1999/xhtml' style='font-size:20px'><p>" +
                  "</p>
<table border='1'>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<p>" +
               "</div>
<p>" +
             "</foreignObject>" +
           "</svg>";
var DOMURL = self.URL || self.webkitURL || self;
var img = new Image();
var svg = new Blob([data], {type: "image/svg+xml;charset=utf-8"});
var url = DOMURL.createObjectURL(svg);
img.onload = function() {
    ctx.drawImage(img, 0, 0);
    DOMURL.revokeObjectURL(url);
};
img.src = url;
</script>

插件代码

<?php
/**
 * Plugin Name: Smart Forms - Query Api Demo
 */

add_shortcode('my-custom-table','smart_forms_demo_custom_table');

function smart_forms_demo_custom_table(/** @noinspection PhpUnusedParameterInspection */ $attr,$content)

{ //these are form fields ids
    require_once SMART_FORMS_API;
    $query=new SmartFormsQuery(1);

    $query->AddField('rnField01');

    $query->AddField('rnField02');

    $query->AddField('rnField03');
    $query->AddField('rnField04');
    $query->AddField('rnField06');
    $query->AddField('rnField07');
    $query->AddField('rnField08');
    $query->AddField('EB');
    $query->AddField('EP');
    $query->AddField('EL');
    $query->AddField('CC');
    $query->AddField('C');
    $query->AddField('Y');
    $query->AddField('X');
    $query->AddField('nocp2');
    $query->AddField('nocp3');
    $query->AddField('nocp4');

    $query->AddCondition('_UserId','=',get_current_user_id());

    $result= $query->GetResults();

    echo "<h4>your customized sign</h4>";
    echo "<strong>Product Code:</strong>".esc_html($result[0]['Y']).'<br/>';
    echo "<strong>Product Price:</strong>".esc_html($result[0]['X']).'<br/>';

}

0 个答案:

没有答案