xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

hashChange & url change & QRCode & canvas to image


"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 *
 * @description iframe for eapp tesing
 * @augments
 * @example
 *
 */

const iframeForEapp = (debug = false) => {
    let iframe = document.querySelector(`[data-dom="iframe"]`);
    let hash_url = window.parent.location.hash.slice(1);
    if (iframe && hash_url) {
        iframe.src = `http://${hash_url}`;
    } else {
        if (debug) {
            console.log(`hash_url =`, hash_url);
        }
    }
};

let iframe = document.querySelector(`[data-dom="iframe"]`);
if (iframe) {
    let url = window.parent.location.search.slice(1);
    console.log(`url =`, url);
    // iframe.src = `http://${url}`;
    let hash_url = window.parent.location.hash.slice(1);
    console.log(`hash_url =`, hash_url);
    iframe.src = `http://${hash_url}`;
}
// hashChange ??? url change

hashChange

https://www.cnblogs.com/xgqfrms/p/9301751.html

SVG to Image

SVG to Image in js

https://www.cnblogs.com/xgqfrms/p/10516810.html

https://www.cnblogs.com/xgqfrms/p/10518203.html

`canvas.toDataURL();`

https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLCanvasElement/toDataURL


<canvas id="canvas" width="5" height="5"></canvas>
<no-script>可以用这样的方式获取一个 data-URL</no-script>

let  canvas = document.getElementById("canvas");
let dataURL = canvas.toDataURL();

console.log(dataURL);
// "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNby... blAAAADElEQVQImWNgoBMAAABpAAFEI8ARAAAAAElFTkSuQmCC"

// 设置 jpeg 图片的质量节
let fullQuality = canvas.toDataURL("image/jpeg", 1.0);
// data:image/jpeg;base64,/9j/4AAQSkZJRgABAQ...9oADAMBAAIRAxEAPwD/AD/6AP/Z"

let mediumQuality = canvas.toDataURL("image/jpeg", 0.5);

let lowQuality = canvas.toDataURL("image/jpeg", 0.1);