|
|||||||||
|
|||||||||
|
|||||||||
 |
|||||||||
| |
||
|
|
|
|
|||||||||
|
|||||||||
|
|||||||||
|
|||||||||
| |
||
|
|
|
| |||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
ASP Free Forums Sponsor:
|
|
|
|
#1
October 27th, 2005, 06:31 AM
|
||||
|
||||
see what happens when I am bored...
bored, without internet connection, I tend to do weird things.
for the last couple of days I've messed with javascript and came up with something pretty cool - dynamic graph generator. you give formula with x and y variables, and the code draw the proper graph in XY plane - for example, "y-x=0" is actually the line y=x and y-x*x=0 is the simple parabola. to activate it extract attached zip file contents into the same location and execute ImageGenerator.html file - you'll see blank container and some text boxes below it. first box is the formula, which is equal to 0. try writing y-x in there and click Generate, you should see line slowly created. second box is the Pixels Per Unit: how "dense" the graph will be. default is 100 pixels per unit, which means that in the 800x800 container there are 8 "units" i.e. the range is [-4,4] for X and Y. third box is not really useful, it just define the actual width of each "pixel" drawn inside the container. here is quick preview of the generator capabilities:  as you see, different formulas give very different graph, where using functions like sin or cos make it cyclic. supported functions: sin, cos, tan, abs (absolute value), pow (power - pow(a, b) is a^b), sqrt (square root) you can also see sample images in the zip - gen_1 to gen_8 with the formula used to create them inside gen.txt file. OK, if you got so far you might be useful for me: find formula which give cool graph, or combination of such formulas. having such cool graph, create screen shot and attach it here plus posting the forumula(s) used to generate it, and if it's good enough I'll give reputation points in exchange.  just for the record, here is the full code of the generator: Code:
<html>
<head>
<title>Image Generator</title>
<script type="text/javascript">
var BLACK="pix_black.bmp";
var PIXELS_PER_UNIT=100;
var PIX_WIDTH=1;
var INFINITY=999999999;
var ACTIONS_PER_BATCH=10000;
//Math.pow(x, 2)+Math.pow(y, 2)-0.75
//Math.sin(x)*Math.sin(x)-Math.cos(y)*Math.cos(y)
//Math.sin(x)-Math.tan(y)
//y-Math.sqrt(Math.abs(x))
//x-Math.sqrt(Math.abs(y))
//Math.pow(y, 3)-Math.pow(x, 3)
var pointsCount=0;
var vv1=0;
var vv2=0;
function Generate()
{
var objContainer=document.getElementById("container");
var width=objContainer.clientWidth;
var height=objContainer.clientHeight;
var zeroPoint_X=Math.floor(width/2);
var zeroPoint_Y=Math.floor(height/2);
var start_pos=((-1)*zeroPoint_X);
var end_pos=zeroPoint_X;
var offset_X=objContainer.offsetLeft;
var offset_Y=objContainer.offsetTop;
var PPU=CLngDef(document.getElementById("PPU").value, PIXELS_PER_UNIT);
var start_pos_X=(start_pos/PPU);
var start_pos_Y=(zeroPoint_Y/PPU);
var end_pos_X=(end_pos/PPU);
var end_pos_Y=(((-1)*(zeroPoint_Y))/PPU);
var interval=(1/PPU);
var strEquation=document.getElementById("formula").value;
var objButton=document.getElementById("btnGenerate");
var actionsCount=0;
var curPoints=0;
if (strEquation.length == 0)
{
alert("no equation");
return;
}
objButton.innerHTML = "please wait...";
objButton.disabled = "disabled";
strEquation = ReplaceMath(strEquation);
var x=start_pos_X+vv1;
while (x <= end_pos_X)
{
var y=start_pos_Y-vv2;
while (y >= end_pos_Y)
{
vv2 += interval;
var actionsLimit=ACTIONS_PER_BATCH;
var value=999;
try
{
value = eval(strEquation);
}
catch (e)
{
value = 999;
}
if (Math.abs(value) < interval)
{
var X=(x*PPU)+zeroPoint_X+offset_X;
var Y=(y*PPU)+zeroPoint_Y+offset_Y;
DrawPoint(objContainer, X, Y);
curPoints++;
pointsCount += 1;
}
if (curPoints > 100)
{
actionsLimit = Math.ceil(actionsLimit/Math.floor(curPoints/100));
}
if (actionsCount >= actionsLimit)
{
window.setTimeout("Generate();", 1);
return false;
}
actionsCount++;
y -= interval;
}
vv2 = 0;
vv1 += interval;
x += interval;
}
alert(actionsCount+"\n"+pointsCount);
vv1 = 0;
vv2 = 0;
pointsCount = 0;
objButton.disabled = "";
objButton.innerHTML = "Generate";
return true;
}
function F(x)
{
//return Math.sin(x);
//return (Math.sqrt(Math.abs(x)))/(Math.pow(2, x));
//return Math.pow(2, x);
//var t=Math.cos(x);
//return (t == 0)?(0):((Math.pow(x, 3)*Math.pow(x, 2))/t);
var objInput=document.getElementById("formula");
return eval(objInput.value);
}
function Clear()
{
var objContainer=document.getElementById("container");
var count=0;
while (objContainer.childNodes.length > 0)
{
if (count >= 1000)
{
window.setTimeout("Clear();", 1);
return false;
}
objContainer.removeChild(objContainer.childNodes[0]);
count++;
}
}
function DrawPoint(objContainer, pos_X, pos_Y)
{
var objImage=document.createElement("img");
var PW=parseInt(document.getElementById("PW").value);
if (isNaN(PW))
PW = PIX_WIDTH;
objImage.src = BLACK;
objImage.style.position = "absolute";
objImage.style.left = pos_X+"px";
objImage.style.top = pos_Y+"px";
objImage.style.width = PW+"px";
objImage.style.height = PW+"px";
objContainer.appendChild(objImage);
}
function Print(obj)
{
var m="";
for (o in obj)
{
m += o+": "+obj[o]+", ";
}
alert(m);
}
function ReplaceMath(str)
{
var arrMath=new Array("sin(", "cos(", "tan(", "sqrt(", "abs(", "pow(");
var result=str;
for (var i=0; i<arrMath.length; i++)
{
var pos=0;
var index=result.substr(pos, result.length).indexOf(arrMath[i]);
while ((index >=0 )&&(index < result.length))
{
if (((index-5) < 0)||(result.substr(index-5, 5) != "Math."))
{
result = result.substr(0, index)+"Math."+result.substr(index, result.length);
}
pos = index+1;
index = result.substr(pos, result.length).indexOf(arrMath[i]);
if (index >= 0)
index += pos;
}
}
return result;
}
function CLngDef(num, defValue)
{
var result=parseInt(num);
return (isNaN(result))?defValue:result;
}
function Round(num, digits)
{
var arrTmp=(num+"").split(".");
var intPart=parseInt(arrTmp[0]);
var floatPart="";
if (arrTmp.length > 1)
floatPart = arrTmp[1];
if (digits <= 0)
return intPart;
return parseFloat(intPart+"."+floatPart.substr(0, digits));
}
window.onload=WindowLoad;
function WindowLoad(event)
{
location = "#btnGenerate";
document.getElementById("PPU").value = PIXELS_PER_UNIT;
document.getElementById("PW").value = PIX_WIDTH;
}
</script>
<style type="text/css">
#container {border: 1px solid black; width: 800px; height: 800px;}
</style>
</head>
<body onunload="Clear();">
<div id="container"></div>
<input type="text" id="formula" /> = 0<br />
Pixels Per Unit: <input type="text" id="PPU" /><br />
Pixel Width: <input type="text" id="PW" /><br />
<button id="btnGenerate" onclick="Generate();">Generate</button> <button onclick="Clear();">[clear]</button>
</body>
</html>
(you must have the pixel image "pix_black.bmp" to make it work) this is only the beginning, I plan to improve the generator by adding color support: each graph can be drawn with different color - and more.  Have Fun!!  Last edited by Shadow Wizard : October 27th, 2005 at 06:38 AM.
|
|
#3
October 27th, 2005, 06:45 AM
|
||||
|
||||
|
it is a craazzzyyy
Geez Yahav, how big is your brain????
__________________
Look! Its a ShemZilla   
|
|
#4
October 27th, 2005, 06:45 AM
|
||||
|
||||
|
Quote:
used for debug. 
|
|
#5
October 27th, 2005, 06:47 AM
|
||||
|
||||
|
I agree with nofriends, way too much time
 How did you come up with the idea? Which by the way it's pretty cool
__________________
................... ASCII and ye shall receive .................. Knowledge is the only resource on earth that multiplies when shared Support the Shemzilla Project Powered by C#
|
|
#6
October 27th, 2005, 06:49 AM
|
||||
|
||||
|
Quote:
so, who's up for the challenge? I can offer pretty much points! 
|
|
#7
October 27th, 2005, 06:53 AM
|
||||
|
||||
|
Quote:
that will fill my time. guess I've found it...
|
|
#10
October 27th, 2005, 07:16 AM
|
||||
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
