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

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

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 上提供了很多不同的模板,傻瓜化进行一定的定制,将代码复制下来就行。

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

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

  • 思源笔记

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

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

    22355 引用 • 89463 回帖 • 1 关注

相关帖子

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • founder 1 赞同

    希望早日赚大钱,记得来投资思源笔记,支持笔记的长期健康发展~~~

  • 其他回帖
  • qibin961014

    没懂啥意思诶,好像没有,是不是得手动设置一下类似大纲?😳

  • Penn

    想问一下,你在文档页下,添加子文档,文档页会自动出现子文档的链接吗

    1 回复
  • a844014471

    谢谢分享

  • 查看全部回帖

推荐标签 标签

  • SEO

    发布对别人有帮助的原创内容是最好的 SEO 方式。

    35 引用 • 200 回帖 • 22 关注
  • 招聘

    哪里都缺人,哪里都不缺人。

    190 引用 • 1057 回帖
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 155 关注
  • API

    应用程序编程接口(Application Programming Interface)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

    77 引用 • 430 回帖 • 1 关注
  • 服务

    提供一个服务绝不仅仅是简单的把硬件和软件累加在一起,它包括了服务的可靠性、服务的标准化、以及对服务的监控、维护、技术支持等。

    41 引用 • 24 回帖 • 1 关注
  • TensorFlow

    TensorFlow 是一个采用数据流图(data flow graphs),用于数值计算的开源软件库。节点(Nodes)在图中表示数学操作,图中的线(edges)则表示在节点间相互联系的多维数据数组,即张量(tensor)。

    20 引用 • 19 回帖
  • 酷鸟浏览器

    安全 · 稳定 · 快速
    为跨境从业人员提供专业的跨境浏览器

    3 引用 • 59 回帖 • 25 关注
  • NGINX

    NGINX 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。

    311 引用 • 546 回帖
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 453 关注
  • PWA

    PWA(Progressive Web App)是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术,在网页应用中实现和原生应用相近的用户体验。

    14 引用 • 69 回帖 • 155 关注
  • 强迫症

    强迫症(OCD)属于焦虑障碍的一种类型,是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病,其特点为有意识的强迫和反强迫并存,一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖
  • Flutter

    Flutter 是谷歌的移动 UI 框架,可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作,它正在被越来越多的开发者和组织使用,并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖
  • App

    App(应用程序,Application 的缩写)一般指手机软件。

    91 引用 • 384 回帖 • 1 关注
  • V2EX

    V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。

    17 引用 • 236 回帖 • 328 关注
  • Chrome

    Chrome 又称 Google 浏览器,是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写,包括 WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。

    62 引用 • 289 回帖
  • 星云链

    星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网

    3 引用 • 16 回帖 • 1 关注
  • Wide

    Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发,并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。

    欢迎访问我们运维的实例: https://wide.b3log.org

    30 引用 • 218 回帖 • 629 关注
  • ActiveMQ

    ActiveMQ 是 Apache 旗下的一款开源消息总线系统,它完整实现了 JMS 规范,是一个企业级的消息中间件。

    19 引用 • 13 回帖 • 672 关注
  • 脑图

    脑图又叫思维导图,是表达发散性思维的有效图形思维工具 ,它简单却又很有效,是一种实用性的思维工具。

    26 引用 • 84 回帖 • 2 关注
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架,使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用,例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 21 关注
  • 友情链接

    确认过眼神后的灵魂连接,站在链在!

    24 引用 • 373 回帖
  • Mobi.css

    Mobi.css is a lightweight, flexible CSS framework that focus on mobile.

    1 引用 • 6 回帖 • 733 关注
  • DNSPod

    DNSPod 建立于 2006 年 3 月份,是一款免费智能 DNS 产品。 DNSPod 可以为同时有电信、网通、教育网服务器的网站提供智能的解析,让电信用户访问电信的服务器,网通的用户访问网通的服务器,教育网的用户访问教育网的服务器,达到互联互通的效果。

    6 引用 • 26 回帖 • 510 关注
  • 反馈

    Communication channel for makers and users.

    123 引用 • 911 回帖 • 245 关注
  • PHP

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

    179 引用 • 407 回帖 • 488 关注
  • OkHttp

    OkHttp 是一款 HTTP & HTTP/2 客户端库,专为 Android 和 Java 应用打造。

    16 引用 • 6 回帖 • 62 关注
  • Sublime

    Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。

    10 引用 • 5 回帖