如何用jquery將圖像保存到圖像上

我是javascript的新手。我有以下代碼的JavaScript和HTML。問題是當我下載圖像時，由JavaScript寫入的文本不會顯示在下載的圖像上。或者換句話說，文字不會打印在圖像上。我想要實現的。以下是代碼如何用jquery將圖像保存到圖像上

<script type="text/javascript"> 
 
    jQuery(function($){ 
 

 
    var textover_api; 
 
\t 
 
    $('#target').TextOver({}, function() { 
 
     textover_api = this; 
 
\t 
 
    }); 
 

 
\t 
 

 
    }); 
 

 
</script>

<img src="demo.jpg" id="target" />

我想要實現像http://addtext.com/的功能。

預先感謝。

來源

2015-10-24 Usman Ahmed Mani

我都要寫至少15個字符，但... 。什麼？？？什麼是TextOver？一些自定義的jQuery插件？ – AdamJeffers

我懷疑這是可能的JavaScript。您鏈接的網站很可能會上傳圖片並添加文本服務器端。 –

服務器端是用php。但我鏈接的網站是使用JavaScript。 –

可以使用帆布利用HTML5和這裏返回的base64數據例如：

來源：Javascript; Adding text on image using canvas and save to image

draw(); 

function draw() { 

    var canvas = document.getElementById('idCanvas'); 
    var context = canvas.getContext('2d'); 

    var imageObj = new Image(); 


    imageObj.onload = function() { 
    context.drawImage(imageObj, 0, 0); 
    context.font = "40px Calibri"; 
    context.fillStyle = "red"; 
    context.fillText("My TEXT!", 50, 300); 

    var canvas = document.getElementById('idCanvas'); 
    var dataURL = canvas.toDataURL(); 

    alert(dataURL); 
    } 
imageObj.setAttribute('crossOrigin', 'anonymous'); 
imageObj.src = "http://lorempixel.com/400/200/"; 
};` 

<canvas id="idCanvas" width="576" height="577"></canvas>

http://jsfiddle.net/hmr7c8po/

來源

2015-10-24 20:17:32

不，這不符合我的目的。我可以在php變量中獲得寫在** textover_api **中的值（換句話說就是文本）嗎？或者換句話說，我可以將** textover_api **的值傳遞給一個php變量。 –

對不起，不太瞭解PHP，但是我知道這裏有人很樂意幫助你:)可悲的是，你不是在尋找GL的解決方案。 –

如何用jquery將圖像保存到圖像上

回答

相關問題