Home > Web Front-end > JS Tutorial > body text

12 lines of javascript code to draw a Bagua chart_javascript skills

WBOY
Release: 2016-05-16 16:06:03
Original
1927 people have browsed it

One sentence explanation: Use limited code to build a 1024*1024 color matrix to show off your programming & artistic beauty

Origined from a question on stackexchange. It has been slightly expanded here to support more programming languages ​​and relax the code length limit.
Rules

Target:
By implementing a function get_color_at(x, y) in the template, draw as “interesting” a pattern as possible on a 1024*1024 canvas.

Parameters:
int x, int y, the values ​​are 0 - 1023, corresponding to the coordinate point on the canvas, the upper left corner is the starting point (0,0)

Return:
int r, int g, int b, int alpha, the RGBA components of the corresponding colors, all range from 0 to 255.

Note:
The definition of alpha component in each language may be different, and it is uniformly converted by template to: 0 - 255. The larger the value, the more transparent it is.

Requirements:
You can only edit the code between // {{code start}} - // {{code end}} in the get_color_at(x, y) function body in the template;
The total number of characters of the code cannot exceed 1024, and it must have good readability.

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)&#63;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;
Copy after login

The above is the entire content of this article, I hope you all like it.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template