Org-remark:高效文本标注工具

Org-remark:高效文本标注工具

org-remarkHighlight & annotate text, EWW, Info, and EPUB项目地址:https://gitcode.com/gh_mirrors/or/org-remark

项目介绍

Org-remark 是一个强大的标注工具,专为那些喜欢使用 Org 模式的 Emacs 用户设计。它允许你在文本文件、网站、EPUB 书籍以及 Info 文档上进行高亮和注释。通过使用 Org 模式作为其核心, Org-remark 提供了一种统一且灵活的方式来管理你的旁注,使你能够轻松地基于类别创建稀疏树,搜索和过滤你的高亮笔记。2022年1月18日从“Org-marginalia”更名而来,它带来了数据转换上的注意事项,但大多数情况下,用户无需采取行动即可升级。

项目快速启动

要快速开始使用 Org-remark,首先确保你的系统已经安装了最新版的 Emacs 和 Org 模块。接下来,有两种方法集成 Org-remark:

手动配置

在你的 .emacs 配置文件中,可以通过延迟加载来避免启动时减慢速度:

;; 在Emacs初始化期间延迟加载org-remark
(with-eval-after-load 'org
  (require 'org-remark)
  ;; 设置全局快捷键
  (define-key global-map (kbd "C-c n m") #'org-remark-mark))

使用 use-package

如果你偏好使用 use-package 简化配置,可以添加以下到你的配置文件中:

(use-package org-remark
  :ensure t
  :bind (("C-c n m" . org-remark-mark)
         ("C-c n l" . org-remark-mark-line)
         (:map org-remark-mode-map
          ("C-c n o" . org-remark-open)
          ("C-c n ]" . org-remark-view-next)
          ("C-c n [" . org-remark-view-prev)
          ("C-c n r" . org-remark-remove)
          ("C-c n d" . org-remark-delete)))
  :init
  ;; 初始化设置,如启用全局追踪模式等
  (setq org-remark-global-tracking-mode t))

之后,重启或刷新 Emacs 即可开始使用。

应用案例和最佳实践

  1. 文献阅读:在阅读 PDF 或 EPUB 格式的学术论文时,利用 Org-remark 进行标注,便于后期整理研究笔记。
  2. 代码审查:对于源代码文件,可以用不同颜色的笔(自定义高亮器)标记关键代码段,并记录审查意见。
  3. 在线学习资料整理:通过 org-remark-eww-mode 功能对网页内容进行标注,辅助在线学习过程中的知识整理。

最佳实践:为了维持高效的笔记体系,推荐使用 Org 的标签和分类特性对注释进行组织,方便后续依据特定主题检索和复习。

典型生态项目

虽然 Org-remark 本身是突出的特点在于文本标注,它的生态系统紧密围绕着 Org 模式展开。例如,结合 org-roam 可以构建个人知识库,将你的标注集成进更广泛的知识管理系统中。此外,用户可以通过自定义高亮器和利用 Org 的强大导出功能,将标注后的材料导出为其他格式,实现跨平台的学习和分享。

Org-remark 因其灵活性和与生俱来的 Org 模式兼容性,在文本处理和学习管理领域提供了独特的解决方案,成为众多 Emacs 用户的必备工具之一。


此文档提供了一个基础框架来引导你入门 Org-remark,进一步探索其深度特性和高级用法,请参考官方文档和社区资源。

org-remarkHighlight & annotate text, EWW, Info, and EPUB项目地址:https://gitcode.com/gh_mirrors/or/org-remark

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
<template> <view> <text class="node" v-html="label"></text> <view class="children"> <tree-node v-for="(child, key) in children" :key="key" :treeData="child" /> </view> </view> </template> <script> export default { name: 'TreeNode', props: { treeData: { type: Object | Array, required: true } }, computed: { label() { return ` <u-row justify="center" gutter="10" style="display: flex;justify-content: center; margin: 10px"> <u-col span="4"></u-col> <u-col span="4"> <view style="color: red; background: orange; "> id: ${this.treeData.id} </view> </u-col> <u-col span="4"></u-col> </u-row> <u-row justify="center" gutter="10" style="display: flex;justify-content: center;"> <u-col span="4" style="border: 1px solid red; text-align: center; margin: 10rpx;"> <view> extendOne: ${this.treeData.extendOne} </view> </u-col> <u-col span="4" style="border: 1px solid red; text-align: center; margin: 10rpx;"> <view> extendTwo: ${this.treeData.extendTwo}, </view> </u-col> <u-col span="4" style="border: 1px solid red; text-align: center; margin: 10rpx;"> <view> extendThree: ${this.treeData.extendThree} </view> </u-col> </u-row> ` }, children() { const userExtendThree = this.treeData.userExtendThree if (userExtendThree) { return [userExtendThree] } else { return [] } } } } </script> <style lang="scss" scoped> .tree { font-size: 16px; } .node { display: inline-block; margin-right: 10px; padding: 5px; } .children { margin-left: 20px; } </style> 这个是数据结构 { "createBy": "13774", "createTime": "2023-05-22 16:48:21", "updateBy": "13774", "updateTime": "2023-05-22 17:32:17", "remark": null, "id": 13774, "userId": 13774, "extendOne": 13775, "extendTwo": 13776, "extendThree": 13777, "isLeader": null, "extendId": null, "userExtendThree": { "createBy": "", "createTime": null, "updateBy": "", "updateTime": null, "remark": null, "id": 13777, "userId": 13777, "extendOne": 13778, "extendTwo": 13779, "extendThree": 13780, "isLeader": null, "extendId": null, "userExtendThree": null } } 帮我把label()函数里面的css样式进行美化 使用行内样式。html结构不变只更改css,画成树状结构的,正方形画成圆形。每一层 用 左 右 中 线段展示关系层级
05-24
可以尝试将label()函数里的代码改为以下内容,来实现你想要的效果: ``` <label style="display: flex; flex-direction: row; align-items: center;"> <div style="border-radius: 50%; width: 30px; height: 30px; background-color: orange; color: white; display: flex; justify-content: center; align-items: center; margin-right: 10px;">{{ this.treeData.id }}</div> <div style="border: 1px solid red; border-radius: 10px; padding: 10px; display: flex; flex-direction: row; justify-content: center;"> <div style="margin-right: 10px;">extendOne: {{ this.treeData.extendOne }}</div> <div style="margin-right: 10px;">extendTwo: {{ this.treeData.extendTwo }}</div> <div>extendThree: {{ this.treeData.extendThree }}</div> </div> </label> <div style="display: flex; flex-direction: row; justify-content: center; align-items: center;"> <div style="height: 2px; background-color: red; flex: 1;"></div> <div style="width: 10px; height: 10px; background-color: red; border-radius: 50%; margin: 0 5px;"></div> <div style="height: 2px; background-color: red; flex: 1;"></div> </div> <div style="display: flex; flex-direction: row; justify-content: space-between; margin-top: 20px;"> <tree-node v-for="(child, key) in children" :key="key" :treeData="child" /> </div> ``` 这里,我们使用了 label 标签来包裹节点的内容,并给该标签加上了行内样式,来实现圆形节点的效果。同时,我们添加了一个 div 标签,来展示节点之间的关系。最后,我们将子节点放置在一个 flex 布局的容器中,并设置了一个 margin-top 属性,来实现节点之间的间距。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

咎鲲才

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值