demo
7篇文章 · 0订阅
  • 使用psd.js将PSD转成SVG -- 基础篇（文字&图片）
    随着发展，活动会场页面的题图运营需要线上模板化，而自研的导购素材制作平台接入了海棠-创意中心，通过平台能力，将素材模板化，并且通过配置化的方式生成多种场景化，个性化的素材。但是创意中心的素材模板是基于SVG的，而会场页面的题图基本是基于Photoshop(PS)输出，源文件是P…
    前端框架
  • 基于 D3.js 绘制动态进度条
    我们经常使用svg或canvas来实现动态图形的绘制，但绘制过程相对较繁琐。对于直观漂亮的进度条，社区也有提供成熟的方案例如highcharts/ECharts等等，但基于配置的开发方式终究无法实现100%的自定义绘制。本文将带你使用D3.js从零一步一步实现动态进度条，并分享…
    前端 SVG d3.js
    基于 D3.js 绘制动态进度条
  • 10 个 CSS、SVG 和 Canvas 蒙版（mask）精彩实例
    随着浏览器对蒙版（mask）的支持越来越好，在web开发中使用蒙版（mask）也变得越来越流行，使用它可以实现一些非常好的视觉效果。
    SVG Canvas CSS
    10 个 CSS、SVG 和 Canvas 蒙版（mask）精彩实例
  • 基于 HTML5 WebGL 智能城市的模拟运行
    智能城市是一个系统。也称为网络城市、数字化城市、信息城市。 智能城市建设是一个系统工程：首先实现的是城市管理智能化，由智能城市管理系统辅助管理城市，通过管理系统人们可以监视城市的运行，了解城市每天中发生的变化，以及及时的根据这些变化做出相应的管理；其次是包括智能交通、智能电力、…
    HTML
    基于 HTML5 WebGL 智能城市的模拟运行
  • 用vue2.6实现一个抖音很火的【时间轮盘】屏保小DEMO
    当然实现这个效果，前端的角度来说，有很多，这里介绍最简单的，达到这个效果纯粹是元素圆性布局，如果仅仅是这样肯定没有达到各位老铁心理需求，所以既然，做了肯定是要做一个麻雀虽小五脏俱全的小demo,于是就把vue全家桶用上带设置的小项目。接下来就一步一步带各位从0到1构建这个小东西…
    Vue.js
  • 如何借助SVG+CSS用2个小时撸完一个网易云音乐的动效海报（可控制速度）
    因为平时也关注网易UEDC的订阅号，前几天就看到了这么一个动效，主题是《网易云音乐2018年度听歌报告》，内容是一个人在努力蹬车因为构图简单，创意又不错，所以就试了下用SVG+CSS动画实现起来的难度，大概费时两个小时左右，效率还是蛮高的，总比用AE实现起来快的多得多，下面就捋…
    CSS SVG
  • 响应式编程入门：实现电梯调度模拟器
    据说每个程序员等电梯的时候都思考过电梯的调度算法…所以怎么动手实现一个呢？虽然这个场景貌似有些复杂，但却非常适合使用响应式编程的范式来处理。下面我们会在 RxJS 和 Vue 的基础上，一步步实现出一个最小可用的电梯调度模拟 Demo。 Demo 为了避免读者【脱了裤子就给我看这…
    ReactiveX RxJS