Convert html view to image

-4

Я хочу преобразовать html-представление в изображение. Это код divConvert html view to image

<html> 
<div class="row"> 
<!--image div --> 
<div id="imgspace1" class="container cropit-image-preview1" class="col-md-12" style="border: 1px solid black; height: 250px; position: absolute; top: 10px; right: 10px; left: 10px; background-size: cover;"> 
convert this div to a image.</div></div> 
</html>

Я хочу, чтобы преобразовать это изображение в html. кто-нибудь знает ?

источник

2015-09-17 wtharin

[wkhtml2pdf] (http://wkhtmltopdf.org/) – NDM

, каким образом вы хотите ? –

Если вы хотите повторно использовать это как изображение страницы. вы можете сохранить этот код в таблице, а затем вы можете вставить его там, где вы хотите показать его позже. –

Существует библиотека, которая преобразует HTML в HTML-Canvas. После этого холст может быть сохранен как изображение. Проверьте примеры:

http://html2canvas.hertzen.com/

источник

2015-09-17 10:59:36 DoubleVoid

Вы можете использовать html2canvas библиотека:

function convertImg() { 
 
    html2canvas(document.querySelector('.row'), { 
 
    onrendered: function(canvas) { 
 
     document.body.appendChild(canvas); 
 
    } 
 
    }); 
 
} 
 

 
$('button').click(convertImg);

.row > div { 
 
    background: red; 
 
    color: white; 
 
    overflow: hidden; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script> 
 
<button>Convert page as img.</button> 
 
<div class="row" style='height:260px; position:relative; top:10px;'> 
 
    <div id="imgspace1" class="container cropit-image-preview1" class="col-md-12" style="border: 1px solid black; height: 250px; position: absolute; top: 10px; right: 10px; left: 10px; background-size: cover;"> 
 
    convert this div to a image.</div> 
 
</div>

источник

2015-09-17 11:07:28 Jai

Convert html view to image

ответ

Смежные вопросы