将 HTML 表格另存为图像

2021-12-28 00:00:00 image screenshot html-table php html

我正在构建一个网站,该网站从表单中获取数据(人名)并将其发布到下一页表格中的自定义注释"中.我希望用户能够将他们的笔记"保存为带有自定义名称的图像.有没有办法将特定的 HTML 表格另存为 PNG?也许对网页上的特定坐标进行屏幕截图?

I have a website I am building that takes data (the person's name) from a form and posts it into a customized "note" in a table on the next page. I want the user to then be able to save their "note" as an image with their customized name on it. Is there a way to save a SPECIFIC HTML TABLE as a PNG? Maybe take a screenshot of a specific coordinate on a web page?

如果没有,有没有办法从 HTML 画布中的表单呈现已发布的 PHP 内容?

If not is there a way to render posted PHP content from the form in an HTML canvas?

任何帮助都会很棒.我现在有点过头了.

Any help would be great. I'm in a little over my head right now.

推荐答案

虽然您可以使用各种工具呈现 HTML,但您不能确定这些工具是否会以与浏览器呈现的方式相同的方式呈现 HTML.

While you can render HTML using a variety of tools, you can't be sure that those tools will render the HTML the same way your browser renders it.

如果您的最终目标是生成带有文本的图像,那么让我们解决该问题,而不是尝试使您建议的解决方案奏效.

If your end goal is to generate an image with text on it, then let's solve that problem instead of trying to make the solution you suggested work.

看看 PHP 的 imagettftext() 函数.它包含一个 Example #1,它从可以存储在任何变量中的文本创建一个小的、简单的图像......包括表单变量.

Have a look at PHP's imagettftext() function. It contains an Example #1 which creates a small, simple image from text that can be stored in any variable ... including a form variable.

通过使用此示例,并添加其他一些PHP 的 GD 函数,你可以制作一个像样的表格副本,并确保它看起来完全符合你的要求,而不是 html2ps 或其他一些工具呈现它的方式.

By using this example, and adding a few other of PHP's GD functions, you can make a decent replica of a table, and make sure it looks exactly the way you want it, rather than the way html2ps or some other tool renders it.

<?php
// Set the content-type
header('Content-Type: image/png');

// Create the image
$im = imagecreatetruecolor(400, 30);

// Create some colors
$white = imagecolorallocate($im, 255, 255, 255);
$grey = imagecolorallocate($im, 128, 128, 128);
$black = imagecolorallocate($im, 0, 0, 0);
imagefilledrectangle($im, 0, 0, 399, 29, $white);

// The text to draw
$text = isset($_POST['name']) ? $_POST['name'] : "name";
// Replace path by your own font path
$font = 'arial.ttf';

// Add some shadow to the text
imagettftext($im, 20, 0, 11, 21, $grey, $font, $text);

// Add the text
imagettftext($im, 20, 0, 10, 20, $black, $font, $text);

// Using imagepng() results in clearer text compared with imagejpeg()
imagepng($im);
imagedestroy($im);
?>

以下是上述脚本生成的示例输出:

Here's sample output generated by the above script:

请注意,您需要根据以上链接中的说明提供 arial.ttf.

Note that you'll need to provide arial.ttf per the instructions at the link above.

如果一切都不起作用,请先在屏幕上和您的网络服务器的错误日志中查找错误,然后再在这里跟进.您的 Web 服务器上可能没有安装 PHP 的 GD 模块.如果是这种情况,您应该咨询您的服务器管理员,以确保您可以使用所需的内容.

If things don't work, look for errors both on-screen and in your web server's error log FIRST, before following up here. It's possible that PHP's GD module is not installed on your web server. If this is the case, you should check with your server administrator to make sure what you need is available to you.

相关文章