рисование холста из формы ввода

Question

Я создаю веб-сайт с формой, клиент может создать собственный знак, и на выходе будет указан код продукта, цена и форма продукта, но на другой странице моя проблема в том, что я не могу использовать введенные данные. на странице результатов пользователь будет вводить высоту, ширину, количество строк и столбцов, а форма холста должна отображаться как пользовательский ввод в php.

из НА ЭТОЙ СТРАНИЦЕ , при нажатии на кнопку отправки на странице результатов отображается

[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/>';

}