主要用到截图插件:js-screen-shot: Web 端自定义截屏插件 (原生 JS 版)
主要用到./screenShotPlugin.umd.js文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.2/jquery.min.js"></script>
<script src="./screenShotPlugin.umd.js"></script>
</head>
<style>
#map {
height: 600px;
width: 600px;
background-color: blue;
}
.red {
height: 200px;
width: 200px;
background-color: red;
}
</style>
<body>
<div class="demo-container">
<div id="map">
<div class="red" id="red"></div>
</div>
</div>
<button id="saveImg">截图</button>
</body>
<script type="text/javascript">
$("#saveImg").on("click", function () {
const screenShotHandler = new screenShotPlugin({
enableWebRtc: false, //是否显示选项框
level: 99, //层级级别
completeCallback: this.callback,
closeCallback: this.closeFn,
});
})
</script>
</html>