Przygotowuję edytor tekstu z wykorzystaniem kanonu HTML5, dzięki któremu mogę aktualizować tekst, zmieniać czcionki, przenosić czcionki i przenosić obrazy tła.Tworzenie edytora tekstu opartego na HTML5 <canvas>
Potrzebuję pomocy związanej z przenoszeniem tekstu na płótnie - jak można tego dokonać za pomocą kontekstu z przesunięciem myszy zdarzeń?
Użycie HTML5 do edycji tekstu nie jest zalecane podejście (patrz odpowiedź powyżej fom jbalsas). Mozilla Bespin (Skywriter) była próbą dopóki nie został zamknięty i rozwój przeniesiony na udziały <canvas> edytor ACE oparta:
https://mozillalabs.com/en-US/skywriter/
Atom redaktor przełącz podejście non-płótno, ostatecznie zdecydował się na React.js przyspieszyć proces aktualizacji DOM:
http://blog.atom.io/2014/07/02/moving-atom-to-react.html
jednak <canvas> podstawa Montaż d jest możliwe, nawet jeśli nie jest to zalecane zobaczyć komentarze poniżej i komentarz z jeromeyers:
... also this blog post contains some ideas when DOM based text editing might not work.
Dałem tej odpowiedzi -1, ponieważ jest po prostu nieprawda. Mozilla * zrobiła * to, podobnie jak każdy inny. Ich implementacja canvas była w pełni funkcjonalna i płonąca szybko. W końcu zrezygnowali z niego, ponieważ uznali implementację opartą na modelu DOM za bardziej elastyczną * dla swoich konkretnych celów *, ale to nie znaczy, że PO powinien. Może mieć inne cele. Gdybym mógł, dałbym tę odpowiedź jeszcze jeden -1 za próbę przekonania ludzi, że nie mogą robić rzeczy, których Mozilla nie potrafi. To po prostu absurd. – FtDRbwLXw6
Tak, odradzamy wszelkie działania w stosunku do wszystkiego, co zostało zrobione przez kogokolwiek przed nami. Jestem pewien, że zabierze nam to wspaniałe miejsca. –
Jeśli uważasz, że jest to możliwe, proponuję opublikować odpowiedź, jak to zrobić.
Sam szkic w3c dla płótna nie zaleca tego. Można to przeczytać w canvas best practices
Authors should avoid implementing text editing controls using the canvas element. Doing so has a large number of disadvantages [...] This is a huge amount of work, and authors are most strongly encouraged to avoid doing any of it by instead using the input element, the textarea element, or the contenteditable attribute.
Jeśli potrzebujesz edytora tekstu, można patrzeć na innych wolnych inicjatyw jak CodeMirror
dziękuję za "contenteditable", wygląda na to, czego potrzebowałem! – Nisk
Elementy wejściowe i obszary tekstowe nie mogą mieć arbitralnego formatowania, a wsparcie dla contenteditable jest okropne na platformach mobilnych – Michael
Kiedy czytasz wady z wersji roboczej w3c dla płótna, to zaleca się tylko, aby "ponieważ było dużo pracy", aby odbudować wszystkie funkcje . W3c nie chce wiedzieć, jak działają kodery! Cóż, nie zawsze potrzebujesz wszystkich funkcji, szczególnie w przypadku niektórych prostych potrzeb. I są bardzo ładne implementacje czystego js. – huelbois
Proszę nie nadużywać ** pogrubienie **. To sprawia, że twoje pytanie jest trudne do odczytania, kiedy pogrubiasz całą sprawę. – meagar
Zapoznaj się z Carota (earwicker.com/carota). Wydaje się, że edytor tekstowy oparty na płótnie jest zrealizowanym marzeniem. Jeszcze go nie używałem, ale planuję włączyć go do strony, którą buduję. Utrzymuje tekst jako JSON z atrybutami formatowania. Prosty i doskonały. – jeromeyers