Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.
https://github.com/akira-cn/graphics

一些图形系统相关的小例子
https://github.com/akira-cn/graphics
Last synced: 9 days ago
JSON representation
一些图形系统相关的小例子
Host: GitHub
URL: https://github.com/akira-cn/graphics
Owner: akira-cn
License: mit
Created: 2020-01-20T08:49:03.000Z (over 4 years ago)
Default Branch: master
Last Pushed: 2022-10-12T07:27:57.000Z (over 1 year ago)
Last Synced: 2024-04-16T14:22:43.231Z (2 months ago)
Language: JavaScript
Size: 10.1 MB
Stars: 531
Watchers: 13
Forks: 209
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE
Lists

awesome-github-star - graphics - cn | 513 | (JavaScript)
README

        # 一些图形系统相关的小例子

https://akira-cn.github.io/graphics/

## 3D基础

- [立方体](https://akira-cn.github.io/graphics/3d-basic/cube.html)

- [圆柱](https://akira-cn.github.io/graphics/3d-basic/cylinder.html)

## 3D相机

- [圆柱裁切](https://akira-cn.github.io/graphics/3d-camera/cylinder-clip.html)

- [正交相机](https://akira-cn.github.io/graphics/3d-camera/cylinder-ortho.html)

- [透视相机](https://akira-cn.github.io/graphics/3d-camera/cylinder-perspective.html)

- [圆柱](https://akira-cn.github.io/graphics/3d-camera/cylinder.html)

- [使用Ogl](https://akira-cn.github.io/graphics/3d-camera/ogl-basic.html)

## 3D模型矩阵

- [轴角](https://akira-cn.github.io/graphics/3d-model/axis-angle.html)

- [欧拉角](https://akira-cn.github.io/graphics/3d-model/euler-angle.html)

## 动画

- [增量动画](https://akira-cn.github.io/graphics/animate/animate_delta.html)

- [时间动画](https://akira-cn.github.io/graphics/animate/animate_time.html)

- [动画封装](https://akira-cn.github.io/graphics/animate/animator.html)

- [帧动画](https://akira-cn.github.io/graphics/animate/frame_animate.html)

- [css贝塞尔](https://akira-cn.github.io/graphics/animate/lerp-bezier-css.html)

- [js贝塞尔](https://akira-cn.github.io/graphics/animate/lerp-bezier.html)

## webgl动画

- [bezier easing](https://akira-cn.github.io/graphics/animate_webgl/bezier_easing.html)

- [网格动画](https://akira-cn.github.io/graphics/animate_webgl/cellular-animation.html)

- [片元着色器旋转](https://akira-cn.github.io/graphics/animate_webgl/fragment_rotation_animator.html)

- [片元着色器旋转](https://akira-cn.github.io/graphics/animate_webgl/fragment_rotation_animator2.html)

- [帧动画](https://akira-cn.github.io/graphics/animate_webgl/frame_animate.html)

- [补间easing](https://akira-cn.github.io/graphics/animate_webgl/lerp_easing.html)

- [补间动画](https://akira-cn.github.io/graphics/animate_webgl/lerp.html)

- [粒子动画](https://akira-cn.github.io/graphics/animate_webgl/particle.html)

- [顶点移动动画](https://akira-cn.github.io/graphics/animate_webgl/vertex_move_animator.html)

- [顶点移动easing](https://akira-cn.github.io/graphics/animate_webgl/vertex_move_easing.html)

- [顶点旋转动画](https://akira-cn.github.io/graphics/animate_webgl/vertex_rotation_animator.html)

- [顶点旋转](https://akira-cn.github.io/graphics/animate_webgl/vertex_rotation.html)

## 贝塞尔

- [3阶贝塞尔曲线](https://akira-cn.github.io/graphics/bezier/cubic.html)

- [2阶贝塞尔曲线](https://akira-cn.github.io/graphics/bezier/quadratic.html)

## canvas

- [基础](https://akira-cn.github.io/graphics/canvas/basic/index.html)

- [层次结构图](https://akira-cn.github.io/graphics/canvas/hierarchy/index.html)

## 颜色

- [color-cubehelix](https://akira-cn.github.io/graphics/color-hints/color-cubehelix.html)

- [color-hints-hsl](https://akira-cn.github.io/graphics/color-hints/color-hints-hsl.html)

- [color-hints-rgb](https://akira-cn.github.io/graphics/color-hints/color-hints-rgb.html)

- [color-hsl-problem](https://akira-cn.github.io/graphics/color-hints/color-hsl-problem.html)

- [color-lab](https://akira-cn.github.io/graphics/color-hints/color-lab.html)

## covid 可视化

- [covid-动态](https://akira-cn.github.io/graphics/covid-vis/covid-dynamic.html)

- [covid-静态](https://akira-cn.github.io/graphics/covid-vis/covid-static.html)

- [墨卡托-topojson](https://akira-cn.github.io/graphics/covid-vis/mercator-topojson.html)

- [墨卡托](https://akira-cn.github.io/graphics/covid-vis/mercator.html)

## 坐标系

- [坐标变换](https://akira-cn.github.io/graphics/coordinates/index.html)

## 数据图表-css

- [面积图](https://akira-cn.github.io/graphics/data-graph-css/areagraph.html)

- [柱状图](https://akira-cn.github.io/graphics/data-graph-css/bargraph.html)

- [折线图](https://akira-cn.github.io/graphics/data-graph-css/linegraph.html)

- [饼图](https://akira-cn.github.io/graphics/data-graph-css/piegraph.html)

## 数据图表里-svg

- [柱状图](https://akira-cn.github.io/graphics/data-graph-svg/bargraph.html)

## Github贡献图表

- [3D柱状图](https://akira-cn.github.io/graphics/github-contributions/index.html)

## GPU抽奖

- [webgl抽奖](https://akira-cn.github.io/graphics/gl-raffle/index.html)

## 光照

- [环境光](https://akira-cn.github.io/graphics/lights/ambient-light.html)

- [平行光](https://akira-cn.github.io/graphics/lights/directional-light.html)

- [Phong光照](https://akira-cn.github.io/graphics/lights/phong.html)

- [点光源](https://akira-cn.github.io/graphics/lights/point-light.html)

- [镜面高光](https://akira-cn.github.io/graphics/lights/specular.html)

- [聚光灯](https://akira-cn.github.io/graphics/lights/spot-light.html)

## 噪声

- [基础噪声](https://akira-cn.github.io/graphics/noise/basic.html)

- [网格噪声](https://akira-cn.github.io/graphics/noise/cellular-noise.html)

- [云雾](https://akira-cn.github.io/graphics/noise/clouds.html)

- [阶梯噪声](https://akira-cn.github.io/graphics/noise/gradient-noise.html)

- [线](https://akira-cn.github.io/graphics/noise/noise-lines.html)

- [距离场](https://akira-cn.github.io/graphics/noise/noise-sdf.html)

- [天空](https://akira-cn.github.io/graphics/noise/noise-sky.html)

- [二维噪声](https://akira-cn.github.io/graphics/noise/noise2d.html)

- [simplex](https://akira-cn.github.io/graphics/noise/simplex-noise.html)

## 法线贴图

- [立方体](https://akira-cn.github.io/graphics/normal-maps/cube.html)

- [岩石](https://akira-cn.github.io/graphics/normal-maps/rock.html)

## 参数方程

- [参数方程一](https://akira-cn.github.io/graphics/parametric/index.html)

- [参数方程二](https://akira-cn.github.io/graphics/parametric2/index.html)

- [极坐标](https://akira-cn.github.io/graphics/parametric-polar/index.html)

## 后期处理

- [辉光](https://akira-cn.github.io/graphics/pass/bloom.html)

- [模糊](https://akira-cn.github.io/graphics/pass/blur.html)

- [烟雾](https://akira-cn.github.io/graphics/pass/smoke.html)

## 像素处理

- [美颜](https://akira-cn.github.io/graphics/pixels/index4.html)

- [纹理合成一](https://akira-cn.github.io/graphics/pixels/index5.html)

- [纹理合成二](https://akira-cn.github.io/graphics/pixels/index6.html)

- [纹理合成三](https://akira-cn.github.io/graphics/pixels/index7.html)

## 像素处理——着色器

- [组合](https://akira-cn.github.io/graphics/pixels-shader/combine.html)

- [粒子](https://akira-cn.github.io/graphics/pixels-shader/particle.html)

- [纹理颜色变换](https://akira-cn.github.io/graphics/pixels-shader/texture.html)

## 极坐标——着色器

- [花瓣](https://akira-cn.github.io/graphics/polar-shader/bud.html)

- [圆](https://akira-cn.github.io/graphics/polar-shader/circle.html)

- [葫芦](https://akira-cn.github.io/graphics/polar-shader/clover.html)

- [径向](https://akira-cn.github.io/graphics/polar-shader/conic.html)

- [hsv色轮](https://akira-cn.github.io/graphics/polar-shader/hsvwheel.html)

- [玫瑰瓣](https://akira-cn.github.io/graphics/polar-shader/rose.html)

- [玫瑰瓣2](https://akira-cn.github.io/graphics/polar-shader/rose2.html)

## 多边形填充

- [2D多边形填充](https://akira-cn.github.io/graphics/polygon-fill/fill-canvas2d.html)

## 多边形-曲线

- [2D曲线](https://akira-cn.github.io/graphics/polyline-curve/canvas2d.html)

- [挤压曲线](https://akira-cn.github.io/graphics/polyline-curve/webgl-lines-extrude.html)

## 重复与随机

- [网格](https://akira-cn.github.io/graphics/repeat-and-random/grids.html)

- [Mandelbrot集](https://akira-cn.github.io/graphics/repeat-and-random/mandelbrot.html)

- [迷宫](https://akira-cn.github.io/graphics/repeat-and-random/maze.html)

- [随机一](https://akira-cn.github.io/graphics/repeat-and-random/random.html)

- [随机二](https://akira-cn.github.io/graphics/repeat-and-random/random2.html)

## 造型函数

- [基础](https://akira-cn.github.io/graphics/shaping-functions/basic.html)

- [粒子圆效果](https://akira-cn.github.io/graphics/shaping-functions/circle_particle.html)

- [圆轨迹重复](https://akira-cn.github.io/graphics/shaping-functions/circle-repeat.html)

- [剪裁区域](https://akira-cn.github.io/graphics/shaping-functions/clip.html)

- [直线-鼠标操作](https://akira-cn.github.io/graphics/shaping-functions/line-mouse.html)

- [直线-重复](https://akira-cn.github.io/graphics/shaping-functions/line-repeat.html)

- [直线](https://akira-cn.github.io/graphics/shaping-functions/line.html)

- [线段-鼠标操作](https://akira-cn.github.io/graphics/shaping-functions/lineseg-mouse.html)

- [圆形进度条](https://akira-cn.github.io/graphics/shaping-functions/progress.html)

- [重复三角形](https://akira-cn.github.io/graphics/shaping-functions/triangle-repeat.html)

- [三角形](https://akira-cn.github.io/graphics/shaping-functions/triangles.html)

## SVG

- [基础](https://akira-cn.github.io/graphics/svg/basic/index.html)

- [层次结构图](https://akira-cn.github.io/graphics/svg/hierarchy/index.html)

## 三角剖分

- [多边形2D-碰撞检测](https://akira-cn.github.io/graphics/triangluations/polygon2d-collision.html)

- [多边形2D](https://akira-cn.github.io/graphics/triangluations/polygon2d.html)

- [多边形-三角剖分](https://akira-cn.github.io/graphics/triangluations/trianglu-polygon.html)

## 矢量绘制

- [矢量绘制多边形](https://akira-cn.github.io/graphics/vector_draw/index.html)

## 矢量画树

- [矢量画树](https://akira-cn.github.io/graphics/vector_tree/index.html)

## WegGL基础

- [Hello world](https://akira-cn.github.io/graphics/webgl/hello_world.html)

## WebGL粒子

- [粒子效果](https://akira-cn.github.io/graphics/webgl_particles/index.html)