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的页面划词搜索JS
Sep 14 Javascript
ExtJs的Date格式字符代码
Dec 30 Javascript
javascript去除字符串左右两端的空格
Feb 05 Javascript
jQuery实现表格颜色交替显示的方法
Mar 09 Javascript
浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别
Aug 18 Javascript
Mui使用jquery并且使用点击跳转新窗口的实例
Aug 19 jQuery
vue内置指令详解
Apr 03 Javascript
微信小程序表单弹窗实例
Jul 19 Javascript
详解如何更好的使用module vuex
Mar 27 Javascript
vue项目添加多页面配置的步骤详解
May 22 Javascript
JS原型对象操作实例分析
Jun 06 Javascript
vue+element-ui表格封装tag标签使用插槽
Jun 18 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
Can't create/write to file 'C:\WINDOWS\TEMP\...MYSQL报错解决方法
2011/06/30 PHP
yii2实现根据时间搜索的方法
2016/05/25 PHP
thinkPHP5 tablib标签库自定义方法详解
2017/05/10 PHP
xml分页+ajax请求数据源+dom取结果实例代码
2008/10/31 Javascript
JQuery 操作select标签实现代码
2010/05/14 Javascript
使用JavaScript 编写简单计算器
2014/11/24 Javascript
js实现键盘控制DIV移动的方法
2015/01/10 Javascript
js禁止页面刷新与后退的方法
2015/06/08 Javascript
基于JavaScript实现移动端TAB触屏切换效果
2015/10/20 Javascript
基于jquery实现页面滚动时顶部导航显示隐藏
2020/04/20 Javascript
总结在前端排序中遇到的问题
2016/07/19 Javascript
Bootstrap实现带暂停功能的轮播组件(推荐)
2016/11/25 Javascript
react实现菜单权限控制的方法
2017/12/11 Javascript
浅谈vue.js导入css库(elementUi)的方法
2018/03/09 Javascript
vue自定v-model实现表单数据双向绑定问题
2018/09/03 Javascript
JavaScript 对引擎、运行时、调用堆栈的概述理解
2018/10/22 Javascript
vue实现点击隐藏与显示实例分享
2019/02/13 Javascript
nodejs的安装使用与npm的介绍
2019/09/11 NodeJs
vuex管理状态 刷新页面保持不被清空的解决方案
2019/11/11 Javascript
Python ORM框架SQLAlchemy学习笔记之安装和简单查询实例
2014/06/10 Python
python计算书页码的统计数字问题实例
2014/09/26 Python
用Python进行TCP网络编程的教程
2015/04/29 Python
Python实现mysql数据库更新表数据接口的功能
2017/11/19 Python
python实现用类读取文件数据并计算矩形面积
2020/01/18 Python
HTML5-WebSocket实现聊天室示例
2016/12/15 HTML / CSS
基于html5绘制圆形多角图案
2016/04/21 HTML / CSS
一些网络技术方面的面试题
2014/05/01 面试题
培训演讲稿范文
2014/01/12 职场文书
绩效工资分配方案
2014/01/18 职场文书
餐饮营销方案
2014/02/23 职场文书
共产党员公开承诺书范文
2014/03/28 职场文书
小班开学寄语
2014/04/04 职场文书
项目经理任命书内容
2014/06/06 职场文书
学习张林森心得体会
2014/09/10 职场文书
《角的度量》教学反思
2016/02/18 职场文书
Oracle创建只读账号的详细步骤
2021/06/07 Oracle