用于 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引入

配置完后即可使用

本来我看着 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';

效果图


本文来自云栖社区合作伙伴“开源中国”

本文作者:达尔文

原文链接

相关文章
vscode编辑器使用拓展插件background添加背景图片改变外观
vscode编辑器使用拓展插件background添加背景图片改变外观
207 0
|
10月前
|
JSON 前端开发 数据可视化
AMIS【部署 01】amis前端低代码框架可视化编辑器amis-editor本地部署流程
AMIS【部署 01】amis前端低代码框架可视化编辑器amis-editor本地部署流程
1293 0
|
10月前
|
JavaScript
Vue在Element UI下使用富文本框插件quill-editor(我个人不推荐用这个复杂的富文本插件)
Vue在Element UI下使用富文本框插件quill-editor(我个人不推荐用这个复杂的富文本插件)
|
2月前
|
人工智能 自然语言处理 计算机视觉
华为鸿蒙自己家的“AI”编辑器插件用起来到底怎么样?
编辑器AI插件如Codegeex、通义灵码等已问世,但通用性较强而不专精。华为推出的CodeGenie专为鸿蒙开发设计,集成在DevEco 5.0.0以上版本中,提供代码补全、生成等功能,尤其擅长处理鸿蒙相关问题,极大降低了鸿蒙开发的门槛。安装后需重启,支持自然语言生成代码,提升了开发效率。
68 13
|
9月前
|
前端开发 JavaScript PHP
【vscode编辑器插件】前端 php unity自用插件分享
【vscode编辑器插件】前端 php unity自用插件分享
64 0
|
10月前
|
前端开发 数据可视化 API
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
538 0
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
|
10月前
|
前端开发 JavaScript CDN
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(一)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
297 0
|
10月前
|
资源调度 数据可视化 前端开发
基于mathlive从零将公式编辑器集成到可视化搭建平台
基于mathlive从零将公式编辑器集成到可视化搭建平台
243 0
|
10月前
|
定位技术
ArcGIS中各版本ArcMap安装OpenStreetMap编辑工具集插件ArcGIS Editor for OSM
ArcGIS中各版本ArcMap安装OpenStreetMap编辑工具集插件ArcGIS Editor for OSM
235 1
|
10月前
|
算法 Java
vscode插件webgl editor阅读,入门antlr
vscode插件webgl editor阅读,入门antlr
186 0

热门文章

最新文章