Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

显示图片标题功能(已实现)和表格标题功能(请求实现) #152

Closed
BrazilAmando opened this issue Sep 9, 2023 · 12 comments

Comments

@BrazilAmando
Copy link

大神您好,插件中的图片和表格自动编号功能解决了大问题,但仅仅只有编号没有标题,与实际应用场景还有一点点差距,探索如下:

  1. 关于图片标题
    通过修改auto_number.js中以下两处代码,可以完美实现图片下方带标题的自动编号,标题名即为[]中的图片名称
    this.image_css = `
    #write span.md-image.md-img-loaded p::after { /* 添加p标签以获取其alt属性*/
    counter-increment: Figures;
    content: "${this.config.NAMES.image} " counter(write-h2) "-" counter(Figures) " " attr(alt); /* 最后的attr(alt)是图片标题 */
  2. 关于表格标题
    typora默认表格无标签,无法设置表格标题。请问可否通过某种方式使得typora自身表格包含标签(在前),这样应该就可以实现表格带标题的编号了。
    非常感谢!
@obgnail
Copy link
Owner

obgnail commented Sep 9, 2023

@BrazilAmando

你好,感谢反馈。

这个 issue 和 #96 是类似的。这两个需求其实都不好做。

  1. 图片标题的问题。你给出的代码其实是残缺的。网上确实有这个需求的 实现方案 但是都是需要修改 Typora 内置的 frame.js 文件的(其实你可以跟着他的教程修改,也就几分钟时间)。我暂时不考虑实现。一方面是我没有这个需求,另一方面是我暂时想不到该如何在不修改内置文件的前提下低成本的实现。见谅。
  2. 表格标题的问题。这个需求最大问题就是会污染 markdown 语法,会造成兼容灾难。

其实给 table 添加标题是 markdown 的老生常谈的话题了,目前公认有四个比较好的 solution:

  1. 最简单的方式:直接在前面/后面添加一行斜体的文本,充当标题。

  2. 使用拓展语法:比如 markdown-itremarkablePython-Markdown

  3. 使用 Rmarkdown:r-markdown-table-with-a-caption

  4. 使用 html,如下,你可以把他粘贴到 Typora 看一下效果。我还找到了一个 repo 能快速生成对应 html。

    <table>
      <caption>A Caption</caption>
      <thead>
        <tr>
          <th>A</th>
          <th>B</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>2</td>
        </tr>
      </tbody>
    </table>

这些方案都比我们自己自定义一个语法来的好。

@BrazilAmando
Copy link
Author

非常感谢您的及时回复,相比之下,我这个用户反而回复的过晚了:(

  1. 关于图片标题,我这边添加这几个代码后图片显示标题似乎很完美,之前已经贴出完整代码了,这里再截图放一下
    image

image
2. 关于增加表格标题
没想到大神提供如此之多的解决方案,窃以为渲染的时候在

标签后增加是最佳解决方案,最好是由typora原生实现。
作为替代方案,为实现带有编号的表格标题名称,或者说是任何类型的带编号的标签,不知是否可以参考word中的”插入题注“功能,可以自定义任何类型的编号,还可以交叉引用。不知实现起来是否可行?

@obgnail
Copy link
Owner

obgnail commented Sep 11, 2023

@BrazilAmando

您好,针对第一个问题,稍微讨论一下。

我在 Typora 0.9.8 和 1.6.2 版本都没有成功。您的 Typora 版本是多少?之前有什么额外操作吗?

image-20230911224141058

@BrazilAmando
Copy link
Author

我的是最新的1.7.4版本。是否是因为typora的渲染引擎升级了支持更多的CSS特性?我最近有个在typora里放入echarts图表的需求,有个插件可以在旧版本实现该功能,但在1.7.4版就不行,检查发现是因为1.7.4版不支持event.path属性(chrome浏览器官宣放弃)。

@BrazilAmando
Copy link
Author

BrazilAmando commented Sep 12, 2023

image
我这里显示有p标签

@obgnail
Copy link
Owner

obgnail commented Sep 16, 2023

@BrazilAmando

交叉引用的问题我还在想怎么做,可能要缓缓。

不过我也支持 echarts 了,有兴趣的话可以试试。

昨天完成了对 DiagramParser 的抽象,能快速支持【新增代码语法】功能。所以这个需求在几十行代码内完成实现,有兴趣的话可以看下源码。

@BrazilAmando
Copy link
Author

这真是瞌睡了发现了枕头,支持echarts太优秀了!就冲这一点就必须支持,开个赞助通道,一定会有用户支持的。
可惜的是禁用了function功能,我用echarts一般都有比较复杂的交互,有大量自定义函数,还要引入js库读取excel文件数据,仅配置option感觉还是不够痛快
另外,请问方便添加比较好用的思维导图解决方案吗?mermaid中提供的思维导图实在是不习惯,一般用户可能更喜欢mindmap、xmind等风格

@obgnail
Copy link
Owner

obgnail commented Sep 16, 2023

@BrazilAmando

  1. 支持 function 的话有点怕被坏人利用。后续应该会开发,但是默认会关闭此功能。
  2. 思维导图有 markmap 可以用呀。使用方式:启用插件 -> markmap

(1) 插入 markmap 代码块:在代码块里使用
(2) 展示思维导图:在窗口中使用,内容为当前文件的大纲转为而来。

@obgnail
Copy link
Owner

obgnail commented Sep 16, 2023

@BrazilAmando

目前插件系统 在代码块新增的语法有三个:

  1. echarts
  2. markmap
  3. kanban(这个是我自定义语法的,可以在 【启用插件 -> 自定义插件 -> 插入看板】找到)

@BrazilAmando
Copy link
Author

echarts和kanban对我来说用的比较多,markmap估计后面也会用得着,大神开发的插件都是以实用为主,赞!
刚试用了echarts,有几点小小的建议,供参考:

  1. echarts显示出来的是图,但序号是fences x-x ,是否更改为 images x-x更合适?mermaid绘制的图形序号标注存在同样情况。
  2. echarts编辑模式时序号与代码框重叠,而不是保持在图表下方。
  3. 导出为HTML后echarts图表消失。

@obgnail
Copy link
Owner

obgnail commented Sep 19, 2023

@BrazilAmando

阶段性反馈,在最新版本中:

  1. 好多人向我反馈,希望给 echarts 松绑。已经去掉的全部的限制,把所有权限都交给用户了。
  2. 【echarts 编辑模式时序号与代码框重叠】问题。我采取了取巧的方式,在编辑状态去掉了序号,等退出编辑状态再恢复。

@obgnail
Copy link
Owner

obgnail commented Sep 28, 2023

equal to #216

@obgnail obgnail closed this as completed Sep 28, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants