一个在线制作动态数据竞赛的网站,无需代码知识轻松搞定

yumo66612小时前技术文章1


站长寄语

之前介绍过如何通过github上D3.js项目实现动态数据排名,但是,对于没有html代码相关知识的朋友并不友好,现在好了,站长找到一个可以不用代码数据,只需要会用excel表格就可以了,分享给大家,于是就有了今天这篇文章。

官方地址

https://app.flourish.studio/

操作方法

  • 打开上方链接,先注册,注册后进入后台,如下图所示。


  • 点击新建,下拉,选择动态数据竞赛模式,如下图所示。
  • 进入编辑状态后,点击数据(Data),根据表格形式,在桌面新建一个空白表格,之后将表格内的所有内容,全部复制粘贴到其中,如下图所示。
  • 至于获取数据,这就需要自己想办法喽,将里面的内容都替换后,在上传到后台,如下图所示,之后再看preview,预览就可以了,这样数据就动起来了。
  • 右侧就是样式的修改了,诸如单位,大小等等,看自己喜好,如果制作完成,就可以点击右上角生成,会生成一个预览链接,点击它查看即可,如下图所示。
  • 看一下自己做的成果,是不是很有成就感?
  • 制作成视频就更简单了,只需要用录屏应用将整个过程录下来,随后在pr里面剪辑,配音,一个完整的数据动态排名就出现了。

相关文章

盘点在线代码编辑测试网站(在线编写代码网站)

对于一些前端的样式和js效果,我们非常希望可以将这些代码片段保存起来,然后分享给那些想要使用这些样式特效的人,庆幸的是,网络上已经有很多这样的网站了,今天我们就来盘点一下这些非常好用的网站。jsfid...

把CSS代码“减肥”30%后,灯具独立站加载速度快了2秒

”上个月,帮佛山李总做跨境灯具站时,技术顾问的话让他直挠头——网站刚上线,流量还没起来,就被“速度”卡了脖子。我打开Chrome开发者工具,吓了一跳:一个详情页的CSS文件有1.2MB,JS文件800...

源自codepen的25个最受欢迎的HTML/CSS 代码

Codepen是一个非常了不起的网页应用。只要电脑能够上网,你就可以创建HTML, CSS和Javascript。如果你想选择性加入PRO版本,你会得到一些非常酷的效果诸如:世界范围内的成对编程(在线...

从网站检查中复制CSS代码的最简单方法

在处理网站项目时,您是否曾经对使用开发工具感到沮丧?必须在您正在处理的网页和检查器之间来回切换以查看CSS并进行调整通常可能是一个挑战。值得庆幸的是,有一个浏览器扩展程序可以简化该过程:CSS Sca...

可以看得见的代码运行:编程教学网站

可视化的查看代码运行原理的网站以下是几个常见的可视化查看代码运行原理的网站:Python Tutor(http://www.pythontutor.com):Python Tutor 是一个在线的代码...

短网址见多了,来看看这个长长长长长网址

短网址的由来说起短网址的由来,不得不提到一个平台,那就是微博。微博早期时候,每条微博最多只能写 140 个字,这就导致如果你想在一条微博中写一条网址,那么网址就会占用一大半的内容。于是人们就想,能不能...