Eu tenho um aplicativo que carrega uma imagem e quando o usuário clica nele, uma área de texto aparece para esta imagem (usandojquery), onde o usuário pode escrever algum texto na imagem. Qual deve ser adicionado na imagem.

Depois de fazer algumas pesquisas sobre isso, percebi quePIL (Python Imaging Library) pode me ajudar a fazer isso. Então, tentei alguns exemplos para ver como funciona e consegui escrever texto em uma imagem. Mas eu acho que há alguma diferença quando eu tento usarPython Shell e em ambiente web. Quero dizer, o texto na textarea é muito grande em px. Como posso obter o mesmo tamanho de texto ao usar o PIL como o da área de texto?

O texto é Multiline. Como posso torná-lo multilinha na imagem também, usandoPIL?

Existe uma maneira melhor do que usar o PIL? Eu não tenho certeza se esta é a melhor implementação.

html:

<img src="images/test.jpg"/>

é a imagem que está sendo editada

var count = 0;
$('textarea').autogrow();
$('img').click(function(){
    count = count + 1;
    if (count > 1){
        $(this).after('<textarea />');
        $('textarea').focus();
    }   
});

o jquery para adicionar o textarea. Além disso, a área de texto é a posição: tamanho absoluto e fixo.

Devo colocá-lo dentro de um formulário para que eu possa obter coordenadas de textarea na imagem? Eu quero escrever texto na imagem quando o usuário clicar e salvá-lo na imagem.