À propos de la façon de télécharger des codes QR et d'ajouter des filigranes aux images sur toile

Cet article présente principalement des informations pertinentes sur la façon de télécharger des codes QR et d'ajouter des filigranes aux images sur toile. Le contenu est plutôt bon. Je vais le partager avec vous maintenant et le donner comme référence.

Hier, j'ai présenté QRCode.js, un plug-in permettant de générer des codes QR, dessinés à l'aide de HTML5 Canvas. Ainsi, le protagoniste d’aujourd’hui est la toile – l’application pratique de la toile.

1. Téléchargez le code QR (Voir comment générer le code QR)

HTMLCanvasElement fournit la méthode toDataURL , Cette méthode renvoie un URI de données contenant le format de représentation d'image spécifié par le paramètre type. Grâce à cette méthode, nous pouvons générer une image de code QR et la télécharger. Les exemples sont les suivants :

/*html*/
<p id="qrcode">p>
<a href="javascript:;" download="二维码" id="down">下载二维码</a>

/*js*/
var canvas = document.getElementsByTagName(&#39;canvas&#39;)[0];
var downImg = document.getElementById(&#39;down&#39;)
img.href = document.getElementsByTagName(&#39;canvas&#39;)[0].toDataURL(&#39;image/png&#39;)

2. Ajouter un filigrane aux images

L'utilisation des méthodes fillText et drawImage de Canvas peut facilement ajouter un filigrane aux images. Un exemple est le suivant :

/*html*/
<canvas id="canvas"></canvas>

/*js*/
var img = new Image();   // 创建img元素
var canvas = document.getElementById(&#39;canvas&#39;)
var ctx = canvas.getContext(&#39;2d&#39;);
img.src = &#39;myImage.png&#39;;

img.onload = function(){
    ctx.drawImage(img, 0, 0);
    ctx.font="30px yahei";   //设置水印文字
    ctx.fillText("大前端", 1100, 260)
}

Ce qui précède est l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'apprentissage de tout le monde. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Comment utiliser la toile pour réaliser une mosaïque d'images

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!