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 相关文章推荐
jQuery实现表头固定效果的实例代码
May 24 Javascript
基于SVG的web页面图形绘制API介绍及编程演示
Jun 28 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
Aug 07 Javascript
JavaScript 实现完美兼容多浏览器的复制功能代码
Apr 28 Javascript
js如何判断访问是来自搜索引擎(蜘蛛人)还是直接访问
Sep 14 Javascript
js数组常见操作及数组与字符串相互转化实例详解
Nov 10 Javascript
jquery实现可旋转可拖拽的文字效果代码
Jan 27 Javascript
jQuery继承extend用法详解
Oct 10 Javascript
jquery 判断是否支持Placeholder属性的方法
Feb 07 Javascript
setTimeout时间设置为0详细解析
Mar 13 Javascript
Vue编程式跳转的实例代码详解
Jul 10 Javascript
vue-cli3配置与跨域处理方法
Aug 17 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
在Zeus Web Server中安装PHP语言支持
2006/10/09 PHP
PHP与MongoDB简介|安全|M+PHP应用实例详解
2013/06/17 PHP
Android ProgressBar进度条和ProgressDialog进度框的展示DEMO
2013/06/19 PHP
php环境下利用session防止页面重复刷新的具体实现
2014/01/09 PHP
CodeIgniter配置之routes.php用法实例分析
2016/01/19 PHP
Yii2中如何使用modal弹窗(基本使用)
2016/05/30 PHP
javascript转换字符串为dom对象(字符串动态创建dom)
2010/05/10 Javascript
JavaScript中prototype为对象添加属性的误区介绍
2013/10/15 Javascript
jquery处理json数据实例分析
2014/06/03 Javascript
实现非常简单的js双向数据绑定
2015/11/06 Javascript
js实现页面跳转的五种方法推荐
2016/03/10 Javascript
利用JS做网页特效_大图轮播(实例讲解)
2017/08/09 Javascript
JavaScript递归算法生成树形菜单
2017/08/15 Javascript
浅谈Angular4中常用管道
2017/09/27 Javascript
JS实现百度网盘任意文件强制下载功能
2018/08/31 Javascript
浅析微信扫码登录原理(小结)
2018/10/29 Javascript
微信小程序实现form表单本地储存数据
2019/06/27 Javascript
基于layPage插件实现两种分页方式浅析
2019/07/27 Javascript
jQuery实现高度灵活的表单验证功能示例【无UI】
2020/04/30 jQuery
让Vue响应Map或Set的变化操作
2020/11/11 Javascript
快速入门python学习笔记
2017/12/06 Python
Python线程创建和终止实例代码
2018/01/20 Python
解决python3 安装不了PIL的问题
2019/08/16 Python
在pycharm中创建django项目的示例代码
2020/05/28 Python
python学习将数据写入文件并保存方法
2020/06/07 Python
免税水晶:Duty Free Crystal
2019/05/13 全球购物
优秀班干部事迹材料
2014/01/26 职场文书
小学科学教学反思
2014/01/26 职场文书
微电影大赛策划方案
2014/06/05 职场文书
环境保护建议书
2014/08/26 职场文书
优秀中职教师事迹材料
2014/08/26 职场文书
教师岗位职责
2015/02/03 职场文书
讲座通知范文
2015/04/23 职场文书
jQuery实现影院选座订座效果
2021/04/13 jQuery
R9700摩机记
2022/04/05 无线电
Spring 使用注解开发
2022/05/20 Java/Android