12行javascript代码绘制一个八卦图


Posted in Javascript onApril 02, 2015

一句话说明:用有限的代码构建一个1024*1024的颜色矩阵,秀出你的编程&艺术之美

起源于 stackexchange 上的一个问题, 这里稍微做了一下扩展,支持更多编程语言,并放宽了代码长度的限制。
规则

目标:
通过实现 模版 中的一个函数 get_color_at(x, y) ,在一个 1024*1024 的画布上画出尽可能 “有意思” 的图案。

参数:
int x, int y ,取值均为 0 - 1023,对应画布上坐标点,左上角为起始点 (0,0)

返回:
int r, int g, int b, int alpha, 对应颜色的 RGBA 分量,均为 0 - 255。

注意:
各语言中 alpha 分量定义可能不同,由 模版 统一转换为: 0 - 255,值越大越透明。

要求:
只能编辑 模版 中 get_color_at(x, y) 函数体内 // {{code start}} - // {{code end}} 间的代码;
代码总字符数不能超过 1024 个,且有较好的可读性。

if(typeof f_c=="undefined"){
  f_c=function(x,y,px,py,r){
    return Math.sqrt(Math.pow(x-px,2)+Math.pow(y-py,2))<=r;
  };
}
var x0=x-512,y0=y-512;
r=g=b=128;
if(f_c(x0,y0,0,0,512)) r=g=b=(x0>0)?255:0;
if(f_c(x0,y0,0,256,256)&&x0<=0) r=g=b=255;
if(f_c(x0,y0,0,-256,256)&&x0>0) r=g=b=0;
if(f_c(x0,y0,0,256,64)) r=g=b=0;
if(f_c(x0,y0,0,-256,64)) r=g=b=255;

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
js同时按下两个方向键
Dec 01 Javascript
JavaScript Event学习第九章 鼠标事件
Feb 08 Javascript
jquery阻止后续事件只执行第一个事件
Jul 24 Javascript
JavaScript实现给定时间相加天数的方法
Jan 25 Javascript
微信小程序 Record API详解及实例代码
Sep 30 Javascript
图片懒加载imgLazyLoading.js使用详解
Sep 15 Javascript
JS 实现百度搜索功能
Feb 01 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
Mar 07 Javascript
Vue实现6位数密码效果
Aug 18 Javascript
JS实现点击拉拽轮播图pc端移动端适配
Sep 05 Javascript
vue组件之间通信实例总结(点赞功能)
Dec 05 Javascript
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
Nov 06 Javascript
javascript实现随时变化着的背景颜色
Apr 02 #Javascript
javascript中call和apply的用法示例分析
Apr 02 #Javascript
原生js实现类似弹窗抖动效果
Apr 02 #Javascript
JavaScript显示表单内元素数量的方法
Apr 02 #Javascript
原创jQuery弹出层插件分享
Apr 02 #Javascript
JavaScript获取网页表单提交方式的方法
Apr 02 #Javascript
Javascript获取表单名称(name)的方法
Apr 02 #Javascript
You might like
CI(CodeIgniter)框架中的增删改查操作
2014/06/10 PHP
php传值方式和ajax的验证功能
2017/03/27 PHP
PHP基于面向对象实现的留言本功能实例
2018/04/04 PHP
让JavaScript 轻松支持函数重载 (Part 1 - 设计)
2009/08/04 Javascript
禁止JQuery中的load方法装载IE缓存中文件的方法
2009/09/11 Javascript
jQuery each()方法的使用方法
2010/03/18 Javascript
javascript中typeof的使用示例
2013/12/19 Javascript
Jquery 监视按键,按下回车键触发某方法的实现代码
2014/05/11 Javascript
Javascript Objects详解
2014/09/04 Javascript
jQuery通过Ajax返回JSON数据
2015/04/28 Javascript
javascript跨域总结之window.name实现的跨域数据传输
2015/11/01 Javascript
基于JavaScript实现TAB标签效果
2016/01/12 Javascript
基于Vue.js的表格分页组件
2016/05/22 Javascript
原生JS封装ajax 传json,str,excel文件上传提交表单(推荐)
2016/06/21 Javascript
微信小程序 特效菜单抽屉效果实例代码
2017/01/11 Javascript
详解如何让InstantClick兼容MathJax、百度统计等
2017/09/12 Javascript
React-Router如何进行页面权限管理的方法
2017/12/06 Javascript
详解angularjs4部署文件过大解决过程
2018/12/05 Javascript
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
2019/04/04 Javascript
微信小程序实现限制用户转发功能的实例代码
2020/02/22 Javascript
[01:53]DOTA2超级联赛专访Zhou 五年职业青春成长
2013/05/29 DOTA
python 文件操作删除某行的实例
2017/09/04 Python
Django中的Signal代码详解
2018/02/05 Python
详解python 注释、变量、类型
2018/08/10 Python
Python中的heapq模块源码详析
2019/01/08 Python
Pycharm如何打断点的方法步骤
2019/06/13 Python
python getpass模块用法及实例详解
2019/10/07 Python
纯css3实现走马灯效果
2014/12/26 HTML / CSS
浅析移动设备HTML5页面布局
2015/12/01 HTML / CSS
迪卡侬印尼体育用品商店:Decathlon印尼
2020/03/11 全球购物
支部书记四风对照材料
2014/08/28 职场文书
党的群众路线教育实践活动自我剖析材料
2014/10/08 职场文书
求职自我评价怎么写
2015/03/09 职场文书
歼十出击观后感
2015/06/11 职场文书
初中班级口号霸气押韵
2015/12/24 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python