Vditor v1.5.12 发布,图表支持及性能改进

本贴最后更新于 1767 天前,其中的信息可能已经事过境迁

v1.5.12 简介

该版本主要对长篇幅的文本粘贴和渲染做了改进;使用 echarts 对图表进行了支持,具体写法可参见 帮助,展示如下:

{"backgroundColor":"#2c343c","title":{"text":"Customized Pie","left":"center","top":20,"textStyle":{"color":"#ccc"}},"tooltip":{"trigger":"item","formatter":"{a} <br/>{b} : {c} ({d}%)"},"visualMap":{"show":false,"min":80,"max":600,"inRange":{"colorLightness":[0,1]}},"series":[{"name":"访问来源","type":"pie","radius":"55%","center":["50%","50%"],"data":[{"value":235,"name":"视频广告"},{"value":274,"name":"联盟广告"},{"value":310,"name":"邮件营销"},{"value":335,"name":"直接访问"},{"value":400,"name":"搜索引擎"}],"roseType":"radius","label":{"normal":{"textStyle":{"color":"rgba(255, 255, 255, 0.3)"}}},"labelLine":{"normal":{"lineStyle":{"color":"rgba(255, 255, 255, 0.3)"},"smooth":0.2,"length":10,"length2":20}},"itemStyle":{"normal":{"color":"#c23531","shadowBlur":200,"shadowColor":"rgba(0, 0, 0, 0.5)"}},"animationType":"scale","animationEasing":"elasticOut"}]}

v1.5.12 变更记录

  • 73 iframe 添加 max-width enhancement
  • 72 当编辑器父元素为 position: fix 时 hit 计算错误 bug
  • 71 new 之前应保证该 id 元素在 html 中已经渲染 question
  • 70 建议删除 CDN 和代码中的 Dynamic Import invalid
  • 69 Assets 文件夹介绍 question
  • 67 长文本粘贴性能改进 enhancement
  • 66 上传按钮问题 bug
  • 65 options.upload.linkToImgUrl 配置错误提示 enhancement
  • 64 表情太多需要滚动条 enhancement
  • 63 粘贴时 html2md 和 md2html 保持一致 bug
  • 62 升级 highlight.js 到 9.15.8 development
  • 58 添加图表支持 feature

历史版本变更请浏览这里

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • jeffjade

    中午的时候,有将 Vditor 的版本升级至 1.5.12;按照 https://hacpai.com/guide/markdown 的示例写法,发现渲染出来有报如下错误:

    echarts render error:  
    SyntaxError: Unexpected token b in JSON at position 4
    

    特意确认了下,所拷贝的 JSON 是 OK 的,请问是我的使用姿势哪里有问题么?


    等等,应该是我这边的问题,使用时是做了一个配置,而图表 string 其中部分应该是有些需要转义(直接考虑到输入框是 👌 的)。

    1 回复
  • 其他回帖
  • 需要使用严格的 JSON 格式。可以使用 JSON.stringify(data) 把对象传换一下已得标准数据

    1 回复
  • image.png 感觉目前这个大小还好,也可以直接用 https://cdn.jsdelivr.net/npm/vditor@latest/dist/index.min.js , 现在这个社区就是直接用的这个。

    1 回复
  • 他好像是按照比率来进行颜色深浅来渲染的。你里面有几个数字太大了,改成三位数好像就可以了。

    1 回复
  • 查看全部回帖
Vanessa MOD
我们终此一生,就是要摆脱他人的期待,找到真正的自己。 昆明

推荐标签 标签

  • 一些有用的避坑指南。

    69 引用 • 93 回帖
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 696 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具,助力您的学习与思考,让您的大脑更高效的记忆。

    笔记整理交给我,一心只读圣贤书。

    1 引用 • 1 回帖
  • Lute

    Lute 是一款结构化的 Markdown 引擎,支持 Go 和 JavaScript。

    25 引用 • 191 回帖 • 20 关注
  • 微服务

    微服务架构是一种架构模式,它提倡将单一应用划分成一组小的服务。服务之间互相协调,互相配合,为用户提供最终价值。每个服务运行在独立的进程中。服务于服务之间才用轻量级的通信机制互相沟通。每个服务都围绕着具体业务构建,能够被独立的部署。

    96 引用 • 155 回帖
  • Redis

    Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库,并提供多种语言的 API。从 2010 年 3 月 15 日起,Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始,Redis 的开发由 Pivotal 赞助。

    284 引用 • 247 回帖 • 166 关注
  • Bootstrap

    Bootstrap 是 Twitter 推出的一个用于前端开发的开源工具包。它由 Twitter 的设计师 Mark Otto 和 Jacob Thornton 合作开发,是一个 CSS / HTML 框架。

    18 引用 • 33 回帖 • 686 关注
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    162 引用 • 473 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 601 关注
  • 大疆创新

    深圳市大疆创新科技有限公司(DJI-Innovations,简称 DJI),成立于 2006 年,是全球领先的无人飞行器控制系统及无人机解决方案的研发和生产商,客户遍布全球 100 多个国家。通过持续的创新,大疆致力于为无人机工业、行业用户以及专业航拍应用提供性能最强、体验最佳的革命性智能飞控产品和解决方案。

    2 引用 • 14 回帖 • 1 关注
  • QQ

    1999 年 2 月腾讯正式推出“腾讯 QQ”,在线用户由 1999 年的 2 人(马化腾和张志东)到现在已经发展到上亿用户了,在线人数超过一亿,是目前使用最广泛的聊天软件之一。

    45 引用 • 557 回帖 • 213 关注
  • MyBatis

    MyBatis 本是 Apache 软件基金会 的一个开源项目 iBatis,2010 年这个项目由 Apache 软件基金会迁移到了 google code,并且改名为 MyBatis ,2013 年 11 月再次迁移到了 GitHub。

    170 引用 • 414 回帖 • 418 关注
  • SOHO

    为成为自由职业者在家办公而努力吧!

    7 引用 • 55 回帖 • 91 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    6627 引用 • 29719 回帖 • 247 关注
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!

    34 引用 • 467 回帖 • 695 关注
  • Python

    Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。

    536 引用 • 672 回帖
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 24 关注
  • wolai

    我来 wolai:不仅仅是未来的云端笔记!

    2 引用 • 14 回帖 • 3 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 510 关注
  • JRebel

    JRebel 是一款 Java 虚拟机插件,它使得 Java 程序员能在不进行重部署的情况下,即时看到代码的改变对一个应用程序带来的影响。

    26 引用 • 78 回帖 • 622 关注
  • 面试

    面试造航母,上班拧螺丝。多面试,少加班。

    324 引用 • 1395 回帖
  • 安全

    安全永远都不是一个小问题。

    189 引用 • 813 回帖
  • 安装

    你若安好,便是晴天。

    128 引用 • 1184 回帖 • 1 关注
  • Linux

    Linux 是一套免费使用和自由传播的类 Unix 操作系统,是一个基于 POSIX 和 Unix 的多用户、多任务、支持多线程和多 CPU 的操作系统。它能运行主要的 Unix 工具软件、应用程序和网络协议,并支持 32 位和 64 位硬件。Linux 继承了 Unix 以网络为核心的设计思想,是一个性能稳定的多用户网络操作系统。

    915 引用 • 931 回帖
  • SSL

    SSL(Secure Sockets Layer 安全套接层),及其继任者传输层安全(Transport Layer Security,TLS)是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。

    69 引用 • 190 回帖 • 490 关注
  • Flume

    Flume 是一套分布式的、可靠的,可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 601 关注
  • CSDN

    CSDN (Chinese Software Developer Network) 创立于 1999 年,是中国的 IT 社区和服务平台,为中国的软件开发者和 IT 从业者提供知识传播、职业发展、软件开发等全生命周期服务,满足他们在职业发展中学习及共享知识和信息、建立职业发展社交圈、通过软件开发实现技术商业化等刚性需求。

    14 引用 • 155 回帖