用於CKeditor編輯器的視覺化數學公式外掛

基於CKeditor編輯器的視覺化的數學公式編輯器，可以返回數學公式。

將 CKeditor編輯器的config.js開啟，在

CKEDITOR.editorConfig = function( config ) {};

裡面新增

config.extraPlugins = `jdmath`;
config.allowedContent = true;

然後在最後加入

CKEDITOR.config.contentsCss = `/ckeditor_4.7.3_full/ckeditor/plugins/jdmath/mathquill-0.10.1/mathquill.css`;

以上是你編輯器的視覺化部分，下面開始配置你的使用者看到的頁面的程式碼。 在客戶看的頁面新增css引入

<link rel="stylesheet" href="你的CKeditor路徑/plugins/jdmath/mathquill-0.10.1/mathquill.css">

配置完後即可使用

本來我看著 www.jmeditor.com 上面的JMEditor編輯器可以用，很興奮，但是苦於作者長時間沒更新，我的CKeditor編輯器的介面和功能需要其他的東西，所以決定自己寫一個，於是乎參考了一下JMEditor，發現它是基於CKeditor的，所以我寫的外掛就這麼成型了。 但是隨後我發現如果這個公式編輯器過長則生成的HTML程式碼會把資料庫撐滿，於是乎我開始在尋找其他解決方案。

方案一

將公式只讓公式編輯器返回LaTeX程式碼，然後重新進行渲染。看了CKeditor官方的公式外掛就是這麼做的，但是他的插入公式部分需要手寫LaTeX程式碼。非常的不人性化。

config.js程式碼參考

CKEDITOR.editorConfig = function( config ) {
    config.extraPlugins = `jdmath`;
    config.allowedContent = true;
};
CKEDITOR.config.contentsCss = `/ckeditor_4.7.3_full/ckeditor/plugins/jdmath/mathquill-0.10.1/mathquill.css`;

本文來自雲棲社群合作伙伴“開源中國”

本文作者：達爾文

原文連結