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 相关文章推荐
让getElementsByName适应IE和firefox的方法
Sep 24 Javascript
js时间比较示例分享(日期比较)
Mar 05 Javascript
常用的Javascript数据验证插件
Aug 04 Javascript
js实现动态加载脚本的方法实例汇总
Nov 02 Javascript
教你用javascript实现随机标签云效果_附代码
Mar 16 Javascript
学习使用bootstrap基本控件(table、form、button)
Apr 12 Javascript
bootstrap table操作技巧分享
Feb 15 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 Javascript
js+SVG实现动态时钟效果
Jul 14 Javascript
Vue.js 十五分钟入门图文教程
Sep 12 Javascript
详解VScode编辑器vue环境搭建所遇问题解决方案
Apr 26 Javascript
Vue+axios+WebApi+NPOI导出Excel文件实例方法
Jun 05 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
PHP 清空varnish 缓存的详解(包括指定站点下的)
2013/06/20 PHP
php解析html类库simple_html_dom(详细介绍)
2013/07/05 PHP
PHP array_key_exists检查键名或索引是否存在于数组中的实现方法
2016/06/13 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
js Html结构转字符串形式显示代码
2011/11/15 Javascript
node.js读取文件到字符串的方法
2015/06/29 Javascript
Javascript HTML5 Canvas实现的一个画板
2020/04/12 Javascript
JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法
2016/07/01 Javascript
JS获取IE版本号与HTML设置IE文档模式的方法
2016/10/09 Javascript
Javascript+CSS3实现进度条效果
2016/10/28 Javascript
微信小程序购物商城系统开发系列-目录结构介绍
2016/11/21 Javascript
JS操作input标签属性checkbox全选的实现代码
2017/03/02 Javascript
jquery实现图片轮播器
2017/05/23 jQuery
深入理解ES6 Promise 扩展always方法
2017/09/26 Javascript
浅谈js获取ModelAndView值的问题
2018/03/28 Javascript
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
2019/11/18 jQuery
JavaScript的console命令使用实例
2019/12/03 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
2020/09/07 Javascript
uniapp微信小程序实现一个页面多个倒计时
2020/11/01 Javascript
Python操作Word批量生成文章的方法
2015/07/28 Python
快速了解Python开发中的cookie及简单代码示例
2018/01/17 Python
python批量图片处理简单示例
2019/08/06 Python
使用Python的networkx绘制精美网络图教程
2019/11/21 Python
Python日志处理模块logging用法解析
2020/05/19 Python
Python基于os.environ从windows获取环境变量
2020/06/09 Python
Numpy 多维数据数组的实现
2020/06/18 Python
python爬虫中采集中遇到的问题整理
2020/11/27 Python
如何利用python 读取配置文件
2021/01/06 Python
Sephora丝芙兰澳洲官方网站:国际知名化妆品购物
2016/10/27 全球购物
好莱坞百老汇御用王牌美妆:Koh Gen Do 江原道
2018/04/03 全球购物
应届生保险求职信
2013/11/11 职场文书
兴趣小组活动总结
2014/05/05 职场文书
动漫设计与制作专业推荐信
2014/07/07 职场文书
2016年小学优秀班主任事迹材料
2016/02/29 职场文书
求职信如何撰写?
2019/05/22 职场文书
用python批量解压带密码的压缩包
2021/05/31 Python