我正在使用HTML2Canvas捕捉我的html页面的屏幕截图,并将其保存为服务器中的图像。我的Html包含一个d3.js图表和html元素。以svg的形式生成d3.js图表,因此为了捕获svg,我使用Fabric.js将svg转换为画布元素。在此过程完成后,我使用Html2Canvas作为图像捕获整个网页并将其保存在服务器中。
整个过程在Chrome和FF中运行良好。问题是当使用IE时。在IE 11中,除了图表画布元素之外,页面中的其他所有内容都会被捕获。
如能提供任何帮助,我们将不胜感激。
屏幕捕获代码:
函数SaveHtmlAsImage(项目)
{
//创建一个新的画布元素
var c
我使用fabric.js将svg转换为canvas,我使用的代码在chrome中运行良好,但在IE11中创建的canvas被污染,从而阻止我从canvas读取数据,下面是我使用的代码
var d3canvas = document.createElement('canvas');
d3canvas.id = canvasId;
fabric.loadSVGFromString(svg.node().parentNode.innerHTML, function (objects, options) {
var canvasObj = ne
我正在尝试将svg添加到画布并对其进行缩放。最后,我需要获取单个对象。所以我使用这个可怕的方法来克服解组问题。但是在这个位置是不正确的。谁能告诉我一条路径的绝对位置(左和上)。
var canvas = new fabric.Canvas('c');
var str = '<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg"><g><ellipse ry="63" rx="63" i
当SVG包含具有自定义字体的文本时,我有一个问题与渲染SVG在构造in。
如何使SVG在Fabricjs中用自定义字体显示正确?
这是我的代码:
var canvasObject = document.getElementById("editorCanvas");
// set canvas equal size with div
$(canvasObject).width($("#canvasContainer").width());
$(canvasObject).height($("#canvasContainer"
我已经处理这个问题有一段时间了,但是我似乎不能让它工作。Onclick到生成的png图像为空。请看下面的代码...
function svgToCanvas (targetElem,fileName) {
var nodesToRecover = [];
var nodesToRemove = [];
var svgElem = targetElem.find('svg');
console.log(svgElem);
svgElem.each(function(index, node) {
var parentN
解析器是一个能够在目标画布上绘制xml的模块。在移除原始canvas元素并附加干净的canvas之后,canvas将重置,但在进一步重新追加之后,canvas的内容保持不变。
function setAttributes(elem, attrs) {
for (var key in attrs) {
elem.setAttribute(key, attrs[key]);
}
}
var Parser = (function() {
var cleanCanvas = (function() {
var canvas = document.createEleme
我尝试使用fabric js和文件读取器API在画布中读取SVG。
下面是图像的代码,它将与SVG一起工作,但是它不会使用完全的功能,比如变更颜色(setFill)和其他只对SVG工作的功能
var reader = new FileReader(), input = document.getElementById('imgFile');
reader.onload = function (event) {
//loadSVGFromString
var imgObj = new Image();
im
我使用jspdf来捕获Hichchart的内容,它是通过动态单击id动态生成的。在这里,当我点击submit1按钮时,不同的高图表会用动态id.Again生成,当我点击下载按钮时,它会下载pdf.I中动态创建的图表内容,我可以下载,但是相同的图表正在重新下载,而页面上的图表则不同。我已经更新了代码在这里演示,谁能帮我,我只是把html和javascript代码在这里。
html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>