Skip to content

H
html-shot
Commit 2a890870 authored by rockyl's avatar rockyl
Browse files
Options

init

parent 769465b5
Show whitespace changes
Inline Side-by-side
Showing with 64 additions and 6 deletions
node_modules/.yarn-integrity 0 → 100644
View file @ 2a890870
{
"systemParams": "darwin-x64-72",
"modulesFolders": [],
"flags": [],
"linkedModules": [
"@spark/animation",
"@spark/api-base",
"@spark/api-common",
"@spark/common-helpers",
"@spark/projectx",
"@spark/share",
"@spark/ui",
"@spark/utils",
"alias-parser",
"code-mix",
"deviljs",
"duiba-utils",
"fyge",
"html-shot",
"init-project",
"package-readme-generator",
"props-compute",
"psd-parse-web",
"qunity",
"qunity-cli",
"qunity-pixi",
"qunity-scene",
"scss-simple-parser",
"sheet-packer",
"spark-cli",
"spark-test-lib",
"spark-utils",
"spark-wrapper-fyge",
"test",
"tiny-image",
"tree-dsl-react",
"visual-code",
"visual-process",
"zeroing-code-divider",
"zeroing-pack",
"zeroing-template-fill",
"zrender"
],
"topLevelPatterns": [],
"lockfileEntries": {},
"files": [],
"artifacts": {}
}
\ No newline at end of file
package.json
View file @ 2a890870
{ {
"name": "html-shot", "name": "html-shot",
"version": "1.0.16", "version": "1.0.17",
"main": "dist/index.js", "main": "dist/index.js",
"types": "types/index.d.ts", "types": "types/index.d.ts",
"license": "MIT", "license": "MIT",
......
src/dom-parser.ts
View file @ 2a890870
...@@ -28,9 +28,10 @@ const includeStyleKeys = [ ...@@ -28,9 +28,10 @@ const includeStyleKeys = [
export function parseDom(el: HTMLElement = document.body) { export function parseDom(el: HTMLElement = document.body) {
const {left: pX, top: pY, width, height} = el.getBoundingClientRect(); const {left: pX, top: pY, width, height} = el.getBoundingClientRect();
let nodes = [], skip = false; let nodes = [];
walkNode(el, function (childNode) { walkNode(el, function (childNode) {
let vNode, bound, node, isText; let vNode, bound, node, isText;
let skip = false;
switch (childNode.nodeName) { switch (childNode.nodeName) {
case 'IMG': case 'IMG':
node = childNode; node = childNode;
......
src/toCanvas.ts
View file @ 2a890870
...@@ -77,12 +77,15 @@ export async function toCanvas(data: ICData, options: RenderOptions = {}, callba ...@@ -77,12 +77,15 @@ export async function toCanvas(data: ICData, options: RenderOptions = {}, callba
nodes.forEach((n) => { nodes.forEach((n) => {
if (n.type == NodeType.IMAGE) {//图片标签 if (n.type == NodeType.IMAGE) {//图片标签
p.push( p.push(
new Promise((r) => { new Promise((resolve, reject) => {
let img = new Image(); let img = new Image();
img.crossOrigin = 'anonymous' img.crossOrigin = 'anonymous'
img.onload = () => { img.onload = () => {
n.img = img; n.img = img;
r() resolve()
}
img.onerror = () => {
reject(`html shot error: can't fetch image[${img.src}]`);
} }
img.src = n.src; img.src = n.src;
}) })
......
test.html
View file @ 2a890870
...@@ -12,6 +12,8 @@ ...@@ -12,6 +12,8 @@
background-color: orange; background-color: orange;
border-radius: 2.00rem; border-radius: 2.00rem;
border: 0.1rem solid blue; border: 0.1rem solid blue;
width: 5.20rem;
height: 4.40rem;
} }
.bg { .bg {
...@@ -46,8 +48,8 @@ ...@@ -46,8 +48,8 @@
</head> </head>
<body> <body>
<div id="poster" class="poster"> <div id="poster" class="poster">
<div class="bg"></div> <!--<div class="bg"></div>-->
<img class="avatar" src="//yun.duiba.com.cn/aurora/14e3d0fa0e1ff54553a2c8c094b1caffd90f0a43.png"/> <img class="avatar" src="//yun.duiba.com.cn/aurora/14e3d0fa0e1ff54553a2c8c094b1caffd90f0a43.png" style="display: none"/>
<!--<canvas id="canvas" style="position: absolute; left: 10px; top: 10px;"></canvas> <!--<canvas id="canvas" style="position: absolute; left: 10px; top: 10px;"></canvas>
<p class="ppp"> <p class="ppp">
a<br/>bcdefghij a<br/>bcdefghij
......
yarn.lock 0 → 100644
View file @ 2a890870
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment