<canvas> in Laravel Markdown einbetten?

Question

Ist es möglich, ein <canvas> Tag in Markdown einzubetten? Insbesondere hoffe ich, Canvas-Tags einzubetten, um Diagramme aus der Chart.js-Bibliothek in einem Blog-Eintrag mit dem GrahamCampbell/Laravel-Markdown-Paket anzuzeigen, aber es scheint nicht zu funktionieren.

Blog-Eintrag Sample:

Lorem ipsum blah blah blah blah blah.... 

<canvas id="myChart" width="400" height="200"></canvas> 

Lorem ipsum blah blah blah blah blah... 

Meine Laravel Ansicht (post.blade.php) den Körper des Pfostens Blog wie folgt:

<div class="article__body"> 
    {!! Markdown::convertToHtml(e($post->body)) !!} 
</div> 

Derzeit ist das <canvas> Tag wird als Text innerhalb eines <p></p> Tags

Answer 1

kurz, vielleicht. Es hängt davon ab, welche Markdown-Implementierung Sie verwenden.

Der rules Zustand:

Für Markup, die nicht von Markdowns Syntax abgedeckt ist, verwenden Sie einfach HTML selbst. Sie müssen es weder vorschreiben noch abgrenzen, um anzuzeigen, dass Sie von Markdown zu HTML wechseln. Sie verwenden nur die Tags.

Welche, natürlich, würde darauf hindeuten, dass es funktionieren sollte. Aber dann gibt es das lästige Problem des HTML, das in einem <p> Umbau eingeschlossen wird. Der nächste Absatz im Regelzustand:

Die einzigen Einschränkungen sind, dass HTML-Elemente auf Blockebene - z. <div>, <table>, <pre>, <p> usw. - müssen durch Leerzeilen vom umgebenden Inhalt getrennt werden, und die Start- und End-Tags des Blocks dürfen nicht mit Tabulatoren oder Leerzeichen eingerückt werden. Markdown ist intelligent genug, um keine zusätzlichen (unerwünschten) Tags <p> um HTML-Tags auf Blockebene hinzuzufügen.

Das Problem ist, dass Markdown lange vor dem <canvas> Tag erstellt wurde (während des HTML 4 und XHTML 1 Tages) und die meisten Markdown-Implementierungen enthalten nicht den Tag in ihrer Liste der „Block-Level-HTML-Elemente.“ Einige Implementierungen haben jedoch ihren Code in den letzten Jahren aktualisiert, um die neueren HTML 5-Tags auf Blockebene hinzuzufügen. Wenn Sie eine dieser Implementierungen verwenden, sollten Sie ein <canvas>-Tag verwenden können, ohne dass es in eine <p> verpackt wird Etikett.

Sie können einige Implementierungen unter Babelmark2 vergleichen, wobei es scheint, dass etwa die Hälfte der aufgeführten Implementierungen canvas Tags in gewissem Maße unterstützt. Dies ist jedoch eine kleine Stichprobe aller Implementierungen. Eine viel längere, wenn auch unvollständige Liste kann here gefunden werden.