在思源笔记中嵌入动态股票行情(小白教程)

本贴最后更新于 605 天前,其中的信息可能已经渤澥桑田

RT,摸索了两三天总算有了不错的方式,感谢 1995hanjian 的帮助,见如何在思源笔记中嵌入类似 tradeview widge 的小组件? - qibin961014 的回帖 - 链滴 (ld246.com)

背景:小白想要通过思源建立投资笔记。在写文章的时候希望能够嵌入实时的股价图。尝试了几种方法后,现在两中还不错的实现方式:

解决方法一

简单版本:使用新浪财经提供的股价图,方便简单

深市:http://image.sinajs.cn/newchart/daily/n/sz[股票代码].gif
沪市:http://image.sinajs.cn/newchart/daily/n/sh[股票代码].gif
美股:http://image.sinajs.cn/newchart/usstock/daily/[股票代码].gif
分时线查询:http://image.sinajs.cn/newchart/min/n/sh[股票代码].gif
日 K 线查询:http://image.sinajs.cn/newchart/daily/n/sh[股票代码].gif
周 K 线查询:http://image.sinajs.cn/newchart/weekly/n/sh[股票代码].gif
月 K 线查询:http://image.sinajs.cn/newchart/monthly/n/sh[股票代码].gif

http://image.sinajs.cn/newchart/daily/n/sh601006.gif ,就是下图的效果

优点:简单,不用翻墙,静态的图,可以直接插入到思源当中。

缺点:内容不可调整,不好看,不能动。无法显示其他有效信息(如市值、倍数等等)

解决方法二

稍微复杂一些,是在网上看到了 tradingview 提供的小插件,免费股票插件 - 金融 Web 插件 — TradingView(需要科学上网),原来是提供给前段开发人员在网页中方便地插入股票相关的插件,思考能不能直接放在思源里面用。

答案是否定的,试了好多方法。

最后发现好像是思源中嵌入的 iframe 或者 html 不能什么动态内容啥的(楼主纯金融背景,真 IT 小白,只会用统计软件 😭 ),反正是不行。

后来看到一篇帖子在 Notion 中插入股票行情图里面提供了一些解决方案,一个是用 Codepen,缺点是不好看,边上带一个大框。评论区里面有位同学提到将插件做成 html 上传到 github 发布,然后引用的方式,打开了我的脑洞 😂

于是乎,我将简单的代码做成了 html 发布在了 github 上,举个例子,代码如下,感谢 1995hanjian,(真不会写代码,上学的时候学的都还给老师了)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>测试:AAPL</title>
</head>
 
<body>
    <div class="tradingview-widget-container">
          <div id="tradingview_f9372"></div>
  <div class="tradingview-widget-copyright"><a href="https://cn.tradingview.com/symbols/NASDAQ-AAPL/" rel="noopener" target="_blank"><span class="blue-text">AAPL图表</span></a>由TradingView提供</div>
    </div>
</body>
 <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
  <script type="text/javascript">
  new TradingView.widget(
  {
  "width": 980,
  "height": 610,
  "symbol": "NASDAQ:AAPL",
  "interval": "D",
  "timezone": "Etc/UTC",
  "theme": "light",
  "style": "1",
  "locale": "zh_CN",
  "toolbar_bg": "#f1f3f6",
  "enable_publishing": false,
  "allow_symbol_change": true,
  "container_id": "tradingview_f9372"
}
  );
  </script>
</html>

像我一样的小白就直接复制到 txt 里面,文件后缀改成 html,然后上传到 github 发布就行了 😄

然后你获得了一个动态的网页,比如这个简单的测试:AAPL (qibin961014.github.io)

好的,这一次你就可以用思源笔记应用这个 URL 作为 iframe 了,显示效果如下:

image.png

优点:插件功能相当强大,基本相当于一个小的股票浏览器,可以换资产类别、换周期、添加各种图形和指标。而且 tradingview 上提供了很多不同的模板,傻瓜化进行一定的定制,将代码复制下来就行。

缺点:需要科学上网。如果没有代理的话思源笔记显示不正确。

如果有大神还有其他方法或者插件,欢迎分享 ❤️

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    19809 引用 • 75837 回帖 • 1 关注

相关帖子

欢迎来到这里!

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

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

推荐标签 标签

  • Lute

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

    25 引用 • 191 回帖 • 24 关注
  • CAP

    CAP 指的是在一个分布式系统中, Consistency(一致性)、 Availability(可用性)、Partition tolerance(分区容错性),三者不可兼得。

    11 引用 • 5 回帖 • 582 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。

    45 引用 • 113 回帖 • 284 关注
  • Typecho

    Typecho 是一款博客程序,它在 GPLv2 许可证下发行,基于 PHP 构建,可以运行在各种平台上,支持多种数据库(MySQL、PostgreSQL、SQLite)。

    12 引用 • 60 回帖 • 457 关注
  • 小说

    小说是以刻画人物形象为中心,通过完整的故事情节和环境描写来反映社会生活的文学体裁。

    28 引用 • 108 回帖
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具,主要功能包括:位置相关的内容递送;用户认证和授权;集中式网络监控。

    1 引用 • 7 回帖 • 552 关注
  • Hadoop

    Hadoop 是由 Apache 基金会所开发的一个分布式系统基础架构。用户可以在不了解分布式底层细节的情况下,开发分布式程序。充分利用集群的威力进行高速运算和存储。

    84 引用 • 122 回帖 • 619 关注
  • HHKB

    HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘(Capacitive Keyboard)。

    5 引用 • 74 回帖 • 422 关注
  • 黑曜石

    黑曜石是一款强大的知识库工具,支持本地 Markdown 文件编辑,支持双向链接和关系图。

    A second brain, for you, forever.

    10 引用 • 88 回帖
  • 30Seconds

    📙 前端知识精选集,包含 HTML、CSS、JavaScript、React、Node、安全等方面,每天仅需 30 秒。

    • 精选常见面试题,帮助您准备下一次面试
    • 精选常见交互,帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段,帮助你获取最佳实践
    • 精选常见代码集,帮助您提高打码效率
    • 整理前端界的最新资讯,邀您一同探索新世界
    488 引用 • 383 回帖 • 4 关注
  • 电影

    这是一个不能说的秘密。

    120 引用 • 597 回帖
  • 阿里云

    阿里云是阿里巴巴集团旗下公司,是全球领先的云计算及人工智能科技公司。提供云服务器、云数据库、云安全等云计算服务,以及大数据、人工智能服务、精准定制基于场景的行业解决方案。

    89 引用 • 345 回帖
  • Kubernetes

    Kubernetes 是 Google 开源的一个容器编排引擎,它支持自动化部署、大规模可伸缩、应用容器化管理。

    109 引用 • 54 回帖 • 2 关注
  • OpenResty

    OpenResty 是一个基于 NGINX 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。

    17 引用 • 41 关注
  • 链滴

    链滴是一个记录生活的地方。

    记录生活,连接点滴

    140 引用 • 3720 回帖
  • 七牛云

    七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。

    26 引用 • 222 回帖 • 170 关注
  • B3log

    B3log 是一个开源组织,名字来源于“Bulletin Board Blog”缩写,目标是将独立博客与论坛结合,形成一种新的网络社区体验,详细请看 B3log 构思。目前 B3log 已经开源了多款产品:SymSoloVditor思源笔记

    1083 引用 • 3461 回帖 • 262 关注
  • BookxNote

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

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

    1 引用 • 1 回帖 • 2 关注
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    9 引用 • 32 回帖 • 152 关注
  • PHP

    PHP(Hypertext Preprocessor)是一种开源脚本语言。语法吸收了 C 语言、 Java 和 Perl 的特点,主要适用于 Web 开发领域,据说是世界上最好的编程语言。

    165 引用 • 407 回帖 • 514 关注
  • Redis

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

    284 引用 • 247 回帖 • 148 关注
  • jsoup

    jsoup 是一款 Java 的 HTML 解析器,可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API,可通过 DOM,CSS 以及类似于 jQuery 的操作方法来取出和操作数据。

    6 引用 • 1 回帖 • 476 关注
  • gRpc
    10 引用 • 8 回帖 • 51 关注
  • CentOS

    CentOS(Community Enterprise Operating System)是 Linux 发行版之一,它是来自于 Red Hat Enterprise Linux 依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码,因此有些要求高度稳定的服务器以 CentOS 替代商业版的 Red Hat Enterprise Linux 使用。两者的不同在于 CentOS 并不包含封闭源代码软件。

    238 引用 • 224 回帖
  • GraphQL

    GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖 • 26 关注
  • BAE

    百度应用引擎(Baidu App Engine)提供了 PHP、Java、Python 的执行环境,以及云存储、消息服务、云数据库等全面的云服务。它可以让开发者实现自动地部署和管理应用,并且提供动态扩容和负载均衡的运行环境,让开发者不用考虑高成本的运维工作,只需专注于业务逻辑,大大降低了开发者学习和迁移的成本。

    19 引用 • 75 回帖 • 618 关注
  • 996
    13 引用 • 200 回帖 • 2 关注