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 相关文章推荐
限制复选框的最大可选数
Jul 01 Javascript
jQuery中:animated选择器用法实例
Dec 29 Javascript
javascript委托(Delegate)blur和focus用法实例分析
May 26 Javascript
jquery实现鼠标滑过小图查看大图的方法
Jul 20 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
Jul 01 Javascript
需要牢记的JavaScript基础知识
Sep 25 Javascript
webpack 单独打包指定JS文件的方法
Feb 22 Javascript
详解给Vue2路由导航钩子和axios拦截器做个封装
Apr 10 Javascript
jQuery.validate.js表单验证插件的使用代码详解
Oct 22 jQuery
使用jQuery如何写一个含验证码的登录界面
May 13 jQuery
使用node.JS中的url模块解析URL信息
Feb 06 Javascript
jQuery实现高度灵活的表单验证功能示例【无UI】
Apr 30 jQuery
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设计模式 Bridge (桥接模式)
2011/06/26 PHP
php查找字符串中第一个非0的位置截取
2017/02/27 PHP
php获取excel文件数据
2017/04/21 PHP
Laravel框架实现超简单的分页效果示例
2019/02/08 PHP
你必须知道的JavaScript 中字符串连接的性能的一些问题
2013/05/07 Javascript
JS实现随机数生成算法示例代码
2013/08/08 Javascript
JS中判断null、undefined与NaN的方法
2014/03/24 Javascript
JavaScript实现为input与textarea自定义hover,focus效果的方法
2015/08/21 Javascript
javascript简单实现等比例缩小图片的方法
2016/07/27 Javascript
jQuery表单事件实例代码分享
2016/08/18 Javascript
Jquery和Js获得元素标签名称的方法总结
2016/10/08 Javascript
JS中substring与substr的用法
2016/11/16 Javascript
详解使用Node.js 将txt文件转为Excel文件
2017/07/05 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
2017/07/17 Javascript
javaScript产生随机数的用法小结
2018/04/21 Javascript
Vue实现简单分页器
2018/12/29 Javascript
javascriptvoid(0)含义以及与&quot;#&quot;的区别讲解
2019/01/19 Javascript
详释JavaScript执行环境与执行栈
2019/04/02 Javascript
javascript头像上传代码实例
2019/09/28 Javascript
Python统计日志中每个IP出现次数的方法
2015/07/06 Python
Python实现微信自动好友验证,自动回复,发送群聊链接方法
2019/02/21 Python
Python实现性能自动化测试竟然如此简单
2019/07/30 Python
Python pip 安装与使用(安装、更新、删除)
2019/10/06 Python
Pycharm调试程序技巧小结
2020/08/08 Python
关于Python 解决Python3.9 pandas.read_excel(‘xxx.xlsx‘)报错的问题
2020/11/28 Python
python链表类中获取元素实例方法
2021/02/23 Python
使用CSS3制作一个简单的Chrome模拟器
2015/07/15 HTML / CSS
英文版销售经理个人求职信
2013/11/20 职场文书
升职自荐信
2013/11/28 职场文书
爱岗敬业事迹材料
2014/12/24 职场文书
艺术节开幕词
2015/01/28 职场文书
2015年纪委工作总结
2015/05/13 职场文书
股权投资协议书
2016/03/23 职场文书
导游词之杭州西湖
2019/09/19 职场文书
pytorch交叉熵损失函数的weight参数的使用
2021/05/24 Python
QT与javascript交互数据的实现
2021/05/26 Javascript