D3:SVG随机树与时钟等

基本功能及说明:

1.点击index.html文件,进入主页选择相应的功能。


2.选择svg盆栽随机树:基于D3和SVG生成的盆栽随机树,通过点击“Start Growing!”按钮,来实现盆栽的生长过程,同时更新按钮,继续点击“Growing More”继续生成更多的随机树子叶;最后通过点击“Replant”恢复花盆状态,可以进行重新生成;通过单机“Back”按钮,回到index主页面


3.选择SVG时钟:基于SVG和TweenmaxGSAP的时钟模型,用SVG来绘制时刻表形状,并通过GSAP来实现时钟指针转动的动态效果。进入主页以后会自动匹配系统时间,主要通过Tweenmax的GSAP动画形成环形时钟。浏览后可以通过点击“Back”按钮,回到系统index主界面,完成交互

用途

本文件内容可拆分用于装饰博客等视讯网站框架,增加功能性和可读性

使用的库和工具

jquery-2.1.1.min.js、TweenMax、D3.js、SVG

额外的Svg.css文件用于存放index.html的主界面信息,增强可视化。

其他




https://github.com/elbadaernU404/d3

Powered by Hexo and Hexo-theme-hiker

Copyright © 2017 - 2024 青域 All Rights Reserved.

UV : | PV :