hapus teks yang diperbarui dengan menggunakan perpustakaan kanvas fabricjs

Menambahkan Elemen teks

function add_text() {   
    var myText = new fabric.Text(text,
    {
        fontSize: size,
        fontFamily: fm,
        strokeStyle: sc,
        fill: fc,
        left: myCanvas.getWidth()/2,
        top: myCanvas.getHeight()/2
    });

    myCanvas.add(myText);
}

memperbarui teks dan ukuran

function chng_txt() {
    var obj = myCanvas.getActiveObject();
    var fm = document.getElementById('up_text').value;
    obj.setText(fm);
    myCanvas.add(obj);
    myCanvas.renderALL();
}

function chng_fs() {
    var obj = myCanvas.getActiveObject();
    var fs = document.getElementById('up_size').value;
    obj.setFontsize(fs);
    myCanvas.add(obj);
    myCanvas.renderALL();
}

Menghapus Elemen Teks

function rmv_txt() {
    var obj = myCanvas.getActiveObject();
    myCanvas.remove(obj);
}

Masalah Saya adalah

agar saya dapat menambahkan teks dan memperbarui teks.
Namun saya tidak dapat menghapus elemen teks yang diperbarui.


canvas html5-canvas fabricjs
person Thilakraj    schedule 29.11.2012    source sumber

Jawaban (1)


arrow_upward
1
arrow_downward

Apa yang sebenarnya terjadi adalah Anda menambahkan objek lain di atasnya, yaitu ada dua objek yang sama di atas satu sama lain dan ketika Anda menghapusnya, yang dihapus hanya objek aktif.

Yang harus Anda lakukan adalah menghapus baris myCanvas.add(obj); saat Anda memperbarui teks. jadi kode Anda akan terlihat seperti

function chng_fs() {
    var obj = myCanvas.getActiveObject();
    var fs = document.getElementById('up_size').value;
    obj.setFontsize(fs);
    myCanvas.renderAll();
}

Juga satu hal lagi, selalu lebih baik untuk merender kanvas saat Anda membuat perubahan apa pun, sertakan renderAll() setelah menambahkan dan menghapus objek meskipun berfungsi dengan baik dan bukan "renderALL" melainkan "renderAll", menurut saya Anda ketahuilah ini, hanya kesalahan ketik saat memposting jika tidak, Anda tidak akan melihat properti teks berubah.

person Suchan Dongol    schedule 29.11.2012