Question

这是我在名为canvas.php

的页面中的画布图像

  <html>
    <body>
    <style type="text/css">
    table
    {
    border=5;
    }
    </style>
    <p><canvas id="canvas" style="border:2px solid black;" width="500" height="500"></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%'>" +
                   "<div xmlns='http://www.w3.org/1999/xhtml' style='font-size:40px'>" +
                     "<table><tr><td>HI</td><td>Welcome</td></tr><tr><td>Hello</td><td>World</td></tr> </table>" +
                   "</div>" +
                 "</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>
    </body>
    </html>

我希望将此图像作为其他页面中的图像... ...基本上我希望能够在otherpage.php

中执行此操作

<img src="www.mysite.com/canvas.php" />

这个图像会不时地动态变化..所以我不想保存它...只是想把它显示在没有画布的另一个页面中

Answer 1

您不能在PHP文件中使用canvas并使用img调用该PHP，

Canvas适用于Javascript PHP文件头必须设置为
image / png或image / jpg header( "Content-type: image/png" );

“iframe是不可能的”好吧！

您唯一的解决方案是使用PHP image，PHP: imagecreate

创建文件myImg.php：

<?php
header( "Content-type: image/png" ); // set this php file as png file
$my_img = imagecreate( 200, 200 ); // image width & height
$background = imagecolorallocate( $my_img, 245,245,245 ); // set the background color
$text_colour = imagecolorallocate( $my_img, 255,66,121 ); // text color
imagestring( $my_img, 10, 50, 90, "Hello World", $text_colour );  // Our Hello World text!
imagepng( $my_img ); // outputs PNG image 
?>

index.html

<img src="myImg.php" /> // this will output the image from myImg.php

请参阅以下资源：

将画布图像表示为其他页面中的实际图像

1 个答案: