Question

大家好我所有的图表都是使用highcharts导出的，我得到了我的php项目的图表

但问题是

我希望导入html内容或整个页面以及图表而不仅仅是图表

可以做吗??

任何人都可以帮助我

或显示此处是一个示例小提琴http://jsfiddle.net/YBXdq/

我需要导出图表下方的文字

Answer 1

有很多直接和间接的方法来实现这个目标

使用HTML Canvas：http://html2canvas.hertzen.com/
使用wkhtmltoimage

示例

  exec('wkhtmltoimage --quality 50 http://www.bbc.com bbc.jpg');

使用wkhtmltopdf + ImageMagic

- 使用wkhtmltopdf
将网页转换为pdf
- 使用ImageMagic

pdf

jpg

实施例

exec("convert a.pdf a.jpg");

使用PHP imagegrabwindow和imagegrabscreen

示例

$browser = new COM("InternetExplorer.Application");
$handle = $browser->HWND;
$browser->Visible = true;
$browser->Navigate("http://localhost");

/* Still working? */
while ($browser->Busy) {
    com_message_pump(4000);
}
$im = imagegrabwindow($handle, 0);
$browser->Quit();

header("Content-Type: image/png");
imagepng($im);
imagedestroy($im);

高级实例

- 另见Get Website Screenshots Using PHP

可能出现的问题：Getting imagegrabscreen to work

使用Webshort并使用exec从php调用它（如果已安装python）

实施例

exec("python webshot.py https://example.com/webshot/php example.png");

下载并使用Website Thumbnail Generator

实施例

webthumb.php?url=http://www.google.com&x=150&y=150

使用boxcutter

示例

exec('boxcutter -f image.png');

使用GrabzIt

示例

$grabzIt = new GrabzItClient("APPLICATION KEY", "APPLICATION SECRET");
$id = $grabzIt->TakePicture("http://www.google.com", "http://www.example.com/GrabzItHandler.php");

使用wimg.ca

此当前页面的示例

  http://wimg.ca/https://stackoverflow.com/questions/10328457/how-to-export-the-whole-page-or-html-content-with-highcharts-not-just-the-chart/10330701#10330701

TimThumb – PHP Image Resizer

示例

 timthumb.php?src=http://www.google.com/&webshot=1

我认为已经提供了足够多的例子

Answer 2

您可以尝试打印页面，或使用php文件函数制作pdf以获得所需的html内容。

或者您可以尝试baba告诉的方法来获取图像：）

Answer 3

我找到了一个简单的解决方法，用于导出图表（打印）

和

我没有使用任何插件只是简单的旧CSS和一些javascript

在我的情况下是

我想打印带有页面特定html内容的图表

或在我的情况下，我想删除页眉，页脚和左侧菜单

我想显示按钮或不必要的内容

只显示页面内容，说明表和图表

所以这就是我如何实现它。

<强>＆GT; CSS： -

<style type="text/css">
@media print{
@page
        {
            size: auto;   /* auto is the initial value */
            margin: 0mm;  /* this affects the margin in the printer settings */
        }
  body{ background-color:#FFFFFF; background-image:none; color:#000000 }
  .navimainbg{ display:none;}
  .printhide{ display:none;}
  .usercontent-footer{ display:none;}
  .linkBTN{ display:none;}
  .userheader{ display:none;}
  .user-profile-left{ display:none;}
  #userbgcontent{ width:100%;}
}
</style>

我们专注于打印页面时我们暗示的打印css

根据您的使用情况，访问您不希望通过他们的班级或ID打印的页面或部分页面

例如

我不想显示按钮

 .linkBTN{ display:none;}

可以通过javascript简单调用。

Javascript： - ＆gt;

<script type="text/javascript">


function printpage()
{

window.print()
}

<script type="text/javascript">

我们可以通过调用我的案例“printpage”中的函数来调用打印功能来打印页面减去我们不希望打印的元素，只需点击按钮即可当打印时，看到此按钮也不会显示，而在priting

时，printhide类显示设置为none

<input title="Print a Printer Friendly Page" class ="printhide" type="button" value="Print this page" onclick="printpage()">

如果您想要打印更多

，这是打印除高级打印以外的图表的简单方法

唯一的问题是，当您想要将图像与某些内容一起显示时，由于缺少渲染图像的大小，图像会向下滑动。它将转移到下一页。除了经过测试的工作。

如何使用Highcharts导出整个页面或html内容而不仅仅是图表？

3 个答案:

<强>＆GT; CSS： -

Javascript： - ＆gt;