html2canvas 能够实现在用户浏览器端直接对整个或部分页面进行截屏。
这个html2canvas脚本将当页面渲染成一个Canvas图片,通过读取DOM并将不同的样式应用到这些元素上实现。
将地图html渲染成图片
<script type="text/javascript" src="js/html2canvas.min.js"></script>
// 递增生成画布
function loadingMap() {
var topicTop = $("#main-map").offset().top;
// canvas
html2canvas(document.getElementById('main-map'), {
width: $("#main-map").width(),
height: $("#main-map").height(),
y: topicTop,
}).then(function (canvas) {
var data = canvas.toDataURL('image/jpeg');
$(".map-canvas img").attr("src",data);
ascending();
});
}