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 相关文章推荐
javascript css float属性的特殊写法
Nov 13 Javascript
javascript Prototype 对象扩展
May 15 Javascript
ExtJS TabPanel beforeremove beforeclose使用说明
Mar 31 Javascript
麻雀虽小五脏俱全 Dojo自定义控件应用
Sep 04 Javascript
JQuery 选择和过滤方法代码总结
Nov 19 Javascript
jQuery中jqGrid分页实现代码
Nov 04 Javascript
Javascript MVC框架Backbone.js详解
Sep 18 Javascript
jquery采用oop模式class类的使用示例
Jan 22 Javascript
JavaScript必知必会(二) null 和undefined
Jun 08 Javascript
浅谈javascript中的constructor
Jun 08 Javascript
理解JavaScript原型链
Oct 25 Javascript
JavaScript 声明私有变量的两种方式
Feb 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中常见数据类型的汇总分享
2014/01/06 PHP
php实现计算百度地图坐标之间距离的方法
2016/05/05 PHP
详解PHP实现支付宝小程序用户授权的工具类
2018/12/25 PHP
Laravel框架查询构造器简单示例
2019/05/08 PHP
laravel-admin 管理平台获取当前登陆用户信息的例子
2019/10/08 PHP
javascript实现动态增加删除表格行(兼容IE/FF)
2007/04/02 Javascript
Javascript处理DOM元素事件实现代码
2012/05/23 Javascript
javascript获取隐藏dom的宽高 具体实现
2013/07/14 Javascript
解决Extjs4中form表单提交后无法进入success函数问题
2013/11/26 Javascript
javascript中基本类型和引用类型的区别分析
2015/05/12 Javascript
JavaScript访问字符串中单个字符的两种方法
2015/07/03 Javascript
详解Vue.js——60分钟组件快速入门(上篇)
2016/12/05 Javascript
深入理解javascript中concat方法
2016/12/12 Javascript
如何给ss bash 写一个 WEB 端查看流量的页面
2017/03/23 Javascript
Vue自定义指令详解
2017/07/28 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
python爬取安居客二手房网站数据(实例讲解)
2017/10/19 Javascript
JS 仿支付宝input文本输入框放大组件的实例
2017/11/14 Javascript
JS实现简单的星期格式转换功能示例
2018/07/23 Javascript
JavaScript事件发布/订阅模式原理与用法分析
2018/08/21 Javascript
node.js使用stream模块实现自定义流示例
2020/02/13 Javascript
javascript设计模式 ? 抽象工厂模式原理与应用实例分析
2020/04/09 Javascript
[13:56]DAC2018 4.5SOLO赛决赛 MidOne vs Paparazi第一场
2018/04/06 DOTA
python中类变量与成员变量的使用注意点总结
2017/04/29 Python
同时安装Python2 &amp; Python3 cmd下版本自由选择的方法
2017/12/09 Python
使用Anaconda3建立虚拟独立的python2.7环境方法
2018/06/11 Python
对python操作kafka写入json数据的简单demo分享
2018/12/27 Python
Python读写文件基础知识点
2019/06/10 Python
python+requests接口压力测试500次,查看响应时间的实例
2020/04/30 Python
为世界各地的女性设计和生产时尚服装:ROMWE
2016/09/17 全球购物
英国时尚泳装品牌:Maru Swimwear
2019/10/06 全球购物
会计主管岗位职责范文
2013/11/08 职场文书
计划生育诚信协议书
2014/11/02 职场文书
基于nginx实现上游服务器动态自动上下线无需reload的实现方法
2021/03/31 Servers
WINDOWS下安装mysql 8.x 的方法图文教程
2022/04/19 MySQL
SpringBoot全局异常处理方案分享
2022/05/25 Java/Android