html2canvas

How does Facebook fun apps create images from information fetched?

自作多情 提交于 2019-12-11 04:57:58
问题 This thing is really irritating. Actually I know how to convert HTML to image using html2canvas library. But I just want to know how most of the people who have Facebook fun apps like this and this, create images. I can get all the required user information using FB API , then how should I create an JPG/PNG image like them? What I have tried is html2canvas but I don't think all other fun apps use this thing. Because when viewed their source code, I couldn't see the HTML element containing all

html2canvas not working for multiple div as canvas

可紊 提交于 2019-12-11 04:40:32
问题 I have tried html2canvas for single div and it is working fine. Now I have 2 charts on page, so I want to capture both div in separate canvas and pass it as image. I tried following but it always set to undefined. I don't know what is the problem. When I go to debug mode in firebug I found that it doesn't go in html2canvas first, it goes in ajax and after execution of ajax, it goes to html2canvas. $("#getPdf").click(function () { var imageChart1, imageChart2; html2canvas($('#loadchart1'), {

html2canvas not working with IE - google map getting rendered as a blank image

怎甘沉沦 提交于 2019-12-11 04:17:30
问题 I am facing this issue only with IE (IE 9 is what i am using.). Its working fine with firefox,chrome,safari. I need to capture the google map image on the click of a button. $(document).ready(function () { var saveMapToDataUrl = function(){ var transform=$('.gm-style>div:first>div').css('transform'); var comp=transform.split(','); //split up the transform matrix var mapleft=parseFloat(comp[4]); //get left value var maptop=parseFloat(comp[5]); //get top value $('.gm-style>div:first>div').css({

html2canvas ignores my svg elements

天涯浪子 提交于 2019-12-11 04:03:38
问题 I try to print screen of my page and then save it into base64 , it works good but it looks like that svg elements are ignored, and some css styles work bad, like :before and :after , original page looks - but after conversion it looks like this - You can see the circle on right side is ignore, and arrow in top menu and same :before and :after on tabs and add new tab button (+). My convert code looks - printOnePage(){ document.getElementById('helpPage').style.display= 'none'; let page =

How to take screen shot from a layout in ionic/cordova/phonegap?

白昼怎懂夜的黑 提交于 2019-12-11 03:56:17
问题 I'm trying to build a cordova based application using ionic. In my application , there is a section which users can select images from our server and move them or do some actions on it(like zoom & rotate ...). At the end I want them to be able to share the result on our website and social medias. My problem is that how can I take a screen shot from the layout which they build it? I've already seen html2canvas library , but it has a problem with out source images that are saved on our server

Esri proxy for Angular 7 project to screenshot

蹲街弑〆低调 提交于 2019-12-11 03:51:18
问题 My team is currently working on a web application with angular 7 front end and .net core 2.1 back-end. One of tasks i need to do is to grab a screenshot and attach it to an email. The web application has an esri-map. For the purposes of capturing the screenshot i am using html2canvas package. It works as expected except for the part that it doesn't capture the esri map content. It captures everything else except the esri-map. For the html2canvas function call, i set the allowTaint property

前端使用html2Canvas将html生成图片(兼容IE)

谁说我不能喝 提交于 2019-12-11 03:11:54
准备工作 // jq 页面必备 必须引入元素嘛 < script src = "./jquery-3.4.1.min.js" > < / script > // bluebird 其实用得比较经常 babel es6 转es5 的一个插件 < script src = "./bluebird.js" > < / script > // html2canvas 我们核心插件 < script src = "./html2canvas.min.js" > < / script > 应用 index.html < body class = "Body" > < div class = "AllWrap relative" > < button title = "保存为图片" style = "position: absolute;top:30px;left:100px;" onclick = "saveCanvas()" > 保 存 < / button > < a href = "" download = "下载图.png" id = "download" > < / a > < / div > < / body 添加脚本 < script > // 判断浏览器是否为IE 且为IE11以下 function isIE ( ) { if ( ! ! window .

html2canvas creates a canvas with a width and height of zero?

自闭症网瘾萝莉.ら 提交于 2019-12-11 02:56:51
问题 I'm trying to use html2canvas do what it says on the tin, but it keeps creating a canvas with a width and height of zero. I'm doing this: var HTMLString = '<p>hello world</p>'; var HTMLStringContainer = document.createElement('div'); HTMLStringContainer.innerHTML = HTMLString; console.log(HTMLStringContainer); html2canvas(HTMLStringContainer,{ onrendered:function(newCanvas){ document.getElementById("image").appendChild(newCanvas); } }); And when I print HTMLStringContainer it shows <div><p

html2canvas missing background

独自空忆成欢 提交于 2019-12-11 02:52:40
问题 I am using html2canvas to generate image from my html page. When I enter my url http://prompter.rareapps.org/prompt/prompt-save2.php?p=123 in webpage renderer of html2canvas website (http://html2canvas.hertzen.com/screenshots.html) my page is rendered corectly with background. But when I generate my own canvas, I do not have the background. Here is my code <script type="text/javascript"> $( document ).ready(function() { html2canvas(document.body, { allowTaint: true, taintTest: false,

Print page using html2canvas

 ̄綄美尐妖づ 提交于 2019-12-11 02:27:42
问题 I'm building a print page function on my web using html2canvas . function printthispage() { html2canvas($("#mydiv"), { onrendered: function (canvas) { var myImage = canvas.toDataURL("image/png"); var printWindow = window.open(myImage); printWindow.document.close(); printWindow.focus(); printWindow.print(); printWindow.close(); } }); } However the window opened and closed immediately. I've tried removing close() , the image showed on new window but no print function was triggered. Is there