Skip to content

Browser clipping extension supports clipping SVG #14523

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.

Sign up for GitHub

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

Jump to bottom
Closed
3 tasks done
ruin1990 opened this issue Apr 7, 2025 · 19 comments
Closed
3 tasks done

Browser clipping extension supports clipping SVG #14523

ruin1990 opened this issue Apr 7, 2025 · 19 comments
Assignees
@88250 @ruin1990
Labels
Enhancement
Milestone
3.1.28

Comments

@ruin1990
Copy link
Contributor

ruin1990 commented Apr 7, 2025

Is there an existing issue for this?

  • I have searched the existing issues

Can the issue be reproduced with the default theme (daylight/midnight)?

  • I was able to reproduce the issue with the default theme

Could the issue be due to extensions?

  • I've ruled out the possibility that the extension is causing the problem.

Describe the problem

问题网址：
https://mp.weixin.qq.com/s/1QW4K_TVhAOSWEish2yyVA

对应网页中的数学公式没有正确识别到

Expected result

正确识别公式

Screenshot or screen recording presentation

Image

Version environment

- Version: 3.1.26
- Operating System: Win 11
- Browser (if used): Chrome 135

Log file

稍微分析了下网页，似乎所有公式都是svg图片内嵌html中

More information

No response
@ruin1990 ruin1990 changed the title Please enter the title of the bug report 网页剪藏数学公式识别异常 Apr 7, 2025
@88250
Copy link
Member

88250 commented Apr 7, 2025

svg 公式剪藏不了，和这个是一个问题 #14338

@88250 88250 closed this as completed Apr 7, 2025
@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 7, 2025 •
edited
Loading

如果插件端能识别到内嵌的svg并标记传输到kernel，kernel那边能将其用html块装起来吗？
目前仅遇到两例，并不常见

@88250
Copy link
Member

88250 commented Apr 7, 2025

不行的，kernel 会跳过 svg 元素解析，如果能转换图片是可行的。

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 7, 2025

预处理直接把svg标签改为img标签？src里存放base64格式的svg图片？这样是不是主流程就不需要动

@88250
Copy link
Member

88250 commented Apr 7, 2025 via email

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 8, 2025 •
edited
Loading 

<img src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIj48Y2lyY2xlIGN4PSIyNSIgY3k9IjI1IiByPSIyMCIgZmlsbD0icmVkIi8+PC9zdmc+" alt="Dynamic SVG Image">

<svg id="originalSvg" width="50" height="50">
  <circle cx="25" cy="25" r="20" fill="red"/>
</svg>

简单试了下，可行，等我研究一下。这个也是强依赖于剪藏后需要刷新页面（变回去有点麻烦啊），如果可以的话，就加入实验性选项里

@88250
Copy link
Member

88250 commented Apr 8, 2025

好的，多谢

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 8, 2025 •
edited
Loading

Image
额，虽然把图片传到了思源，但是成了这个样子，kernel那边没有对内嵌的img节点转存图片吗？因为毕竟不是网络地址，这个我还没思路怎么处理
@88250 能不能帮忙看看这个问题，是需要调用api先存储图片吗？

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 8, 2025 •
edited
Loading

可以解码回svg图，我把节点贴入html里是可以正常显示的

Image

我打包了份插件，可以试试，没有影响网页的显示，大概就是前面讨论的思路
siyuan-chrome.zip

@88250
Copy link
Member

88250 commented Apr 8, 2025

估计得明天才能看了，不好意思。

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 8, 2025

好的，有点奇怪，看起来是直接把src里的原始图片base64数据填充到url里了

@ruin1990
Copy link
Contributor Author

ruin1990 commented Apr 9, 2025 •
edited
Loading

还有个思路就是针对这种src带base64图片元数据的直接转成html块
理论上来说转会svg块更节约存储空间
Image

@88250 88250 reopened this Apr 9, 2025
@88250 88250 added this to the 3.1.28 milestone Apr 9, 2025
@88250 88250 changed the title 网页剪藏数学公式识别异常 Browser clipping extension supports clipping SVG Apr 9, 2025
@88250
Copy link
Member

88250 commented Apr 9, 2025

内核这边也需要改一些代码配合，稍后我提交，我用你之前上传的扩展包测试了，可以正常工作。

@TCOTC
Copy link
Contributor

TCOTC commented Apr 9, 2025

能转回 SVG 的话合理点

88250 added a commit that referenced this issue Apr 9, 2025
@88250
🎨 Browser clipping extension supports clipping SVG #14523

Verified

This commit was signed with the committer’s verified signature.
ctavan Christoph Tavan
GPG key ID: D9B600C63A37FD28
Verified
Learn about vigilant mode
80fbe14
ruin1990 added a commit to ruin1990/siyuan-chrome that referenced this issue Apr 10, 2025
@ruin1990
🎨 Support clipping SVG embedded in HTML siyuan-note/siyuan#14523
22ca324
@ruin1990 ruin1990 mentioned this issue Apr 10, 2025
Merged
@ruin1990
Copy link
Contributor Author

是不是要等到下个release发布了网页插件才能发布，二者有关联

@TCOTC
Copy link
Contributor

TCOTC commented Apr 10, 2025

插件一般先发布，要测试

@ruin1990
Copy link
Contributor Author

插件一般先发布，要测试

嗯，那应该可以，默认其实是关闭的，感觉如果常开很容易把各种emoji和没有摘录意义的小图给全剪藏进去

88250 pushed a commit to siyuan-note/siyuan-chrome that referenced this issue Apr 10, 2025
@ruin1990
🎨 Support clipping SVG embedded in HTML siyuan-note/siyuan#14523 (#16)
96c44bb
@88250
Copy link
Member

88250 commented Apr 10, 2025

稍后发布商店。

@88250 88250 closed this as completed Apr 10, 2025
@TCOTC
Copy link
Contributor

TCOTC commented Apr 10, 2025

效果不错

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@88250 88250

@ruin1990 ruin1990

Labels
Enhancement
Projects
None yet
Milestone
3.1.28
Development

No branches or pull requests
3 participants
@88250 @ruin1990 @TCOTC