2024年2月19日发(作者：)

function Bubble(id, cx, cy, cz, r, speed, accelerate, fill, transform) { = id; = cx; = cy; = cz; this.r = r; = speed; rate = accelerate; = fill; orm = transform;

= draw; = move; }

function draw( groupId ) { var group = mentById( groupId );

if(group == null) { group = ElementNS(svgns, "g" ) ributeNS(null,"id",groupId); Child(group); }

var elem = ElementNS(svgns, "circle" ); ributeNS(null, "id", ); ributeNS(null, "cx", ); ributeNS(null, "cy", ); ributeNS(null, "r", this.r); ributeNS(myNS, "z", );

ributeNS(myNS, "speed", );

ributeNS(myNS, "accelerate", rate);

ributeNS(null,"fill",); ributeNS(null,"transform",orm); Child(elem);

}

function move() { var newSpeed;

//Set new speed by accelerate if( ( + rate) < maxSpeed ) newSpeed = + rate; else newSpeed = maxSpeed;

//Set z distance if( > ) { = - ; = newSpeed; }

else { //Set random position and object back to vinish point = () * maxX; = () * maxY; = maxZ - 1;

= () * maxSpeed; rate = () * (maxAccelerate); }

//Set transform var scale = ()/maxZ; var t3=" scale("+scale+") "; orm = t1+t3+t2; }

// /

// / Bubble class finish

// /

function setRange() { maxX = idth; maxY = eight; centerX = maxX/2; centerY = maxY/2;

t1 = "translate("+centerX+","+centerY+")"; t2 = "translate(-"+centerX+",-"+centerY+")";

//alert(t1+t2); }

function sizeChange() { setRange(); refresh(); }

function refresh() { for (i in objList) { objList[i].move(); }

(sortByZ);

var group = mentById( groupId ); Child(group);

for (i in objList) { objList[i].draw(groupId); }

var group = mentById( groupId ); //alert(printNode(group)); }

function init() { setRange();

for(var i=0; i < count; i++) { var id = "bubble"+i; var cx = () * maxX; var cy = () * maxY; var cz = maxZ - 1;

var r = 50; var speed = () * maxSpeed; var accelerate = () * (maxAccelerate); var fill = "url(#radial2)"; var transform = "scale(1)";

var bubble = new Bubble(id, cx, cy, cz, r, speed, accelerate, fill, transform); objList[] = bubble; }

//Set position and speed etc refresh();

setInterval("refresh()",interval); //alert(printNode(instance)); }

function sortByZ(a,b) { return - ; }

]] >

< defs >

< circle id = " obj1 " r = ' 50 ' fill = ' url(#radial1) ' >

< radialGradient id = " radial1 " cx = " 75% " cy = " 75% " r = " 75% " >

< stop offset = " 15% " stop - color = " white " />

< stop offset = " 100% " stop - color = " red " />

< radialGradient id = " radial2 " cx = " 25% " cy = " 25% " r = " 75% " >

< stop offset = " 15% " stop - color = " white " />

< stop offset = " 100% " stop - color = " blue " />

< radialGradient id = " radial3 " >

< stop offset = " 15% " stop - color = " white " />

< stop offset = " 100% " stop - color = " green " />

var Atoms = new Array(); var Bonds = new Array();

var debugFlag = true ; // My debug flag;

function Initialize(LoadEvent) { SVGDocument = get().getOwnerDocument();

GenerateStructure();

/* if(debugFlag == true) {

s=printNode(mentById("atoms")); alert(s); debugFlag = false; } */ }

function Atom(x, y, z, fillStyle) { FixRange(x, y, z) if (x != null) this.x = x; if (y != null) this.y = y; if (z != null) this.z = z;

= Element("circle"); ributeNS(null,"fill", fillStyle); //ributeNS(null,"filter","url(#dropShadow)"); mentById("atoms").appendChild();

Atoms[] = this; //Save to array h();

return this; }

ype.x = 0 ; ype.y = 0 ; ype.z = 0 ;

= new Array(); t = "" ;

yPhi = 0 ; yTheta = 0 ; ceScalar = 1 ;

h = Atom_Refresh; rds = Atom_FixCoordinates;

ateRotation = Atom_CalculateRotation

function Atom_FixCoordinates() { this.x += XOffset; this.y += YOffset; this.z += ZOffset;

this.x = this.x * Scale; this.y = this.y * Scale; this.z = this.z * Scale;

h() }

function Atom_Refresh() { oldx = this.x oldy = this.y

ateRotation();

if ( != null) { ribute("transform", "translate(" + yX + ", " + yY + ")"); ributeNS(null,"r", yZ); }

//Sort by displayZ

var elem = mentById("atoms"); var nodes = ldNodes; var insertFlag = false;

//for(i = 1;i < (()-1);i += 2) for(i = 0;i < ((-1));i ++) { //Compare by r attribute in SVG node var nodeMap = (i).attributes; var r = edItemNS(null, "r");

if(yZ < lue) { Before(, (i)); insertFlag = true; break; }

}

//The nearest one if(insertFlag == false) Child(); return ((oldx != this.x) || (oldy != this.y)) }

function Atom_CalculateRotation()

{ var clipTheta = true; var clipPhi = true;

for (var I = 1; I < RotationsPerCycle; I++) { dTheta = Theta - yTheta; dPhi = Phi - yPhi;

if ((dTheta > MaxRotationalSpeed * ApproachRange) || (dTheta < MaxRotationalSpeed * ApproachRange * -1)) dTheta = max(min(dTheta, MaxRotationalSpeed), MaxRotationalSpeed * -1) else if ((dTheta < MinTurnIncrement) && (dTheta > MinTurnIncrement * -1)) dTheta = 0 else { dTheta = dTheta / ApproachRange clipTheta = false; } yTheta += dTheta

if ((dPhi > MaxRotationalSpeed * ApproachRange) || (dPhi < MaxRotationalSpeed * ApproachRange * -1)) dPhi = max(min(dPhi, MaxRotationalSpeed), MaxRotationalSpeed * -1) else if ((dPhi < MinTurnIncrement) && (dPhi > MinTurnIncrement * -1)) dPhi = 0 else { dPhi = dPhi / ApproachRange clipPhi = false; } yPhi += dPhi

this.x += dTheta * this.z; this.y += dPhi * this.z; this.z -= (dTheta * this.x) + (dPhi * this.y); }

if (clipTheta) yTheta = Theta - dTheta * (ApproachRange - 1)

if (clipPhi) yPhi = Phi - dPhi * (ApproachRange - 1)

z = this.z if (z < HitherPlane - CameraDistance) { z = HitherPlane - CameraDistance } DistanceScalar = CameraDistance / (z + CameraDistance)

ceScalar = DistanceScalar

yX = this.x * DistanceScalar yY = this.y * DistanceScalar

yZ = DistanceScalar * FontScalar //The bigger z ,the smaller displayZ }

// Create bond between atom, strength affect the storke width

function Bond(Atom1, Atom2, Strength) { = Atom1; = Atom2;

if (Strength != null) th = Strength;

= Element("line"); ributeNS(null,"stroke", "brown"); ributeNS(null,"stroke-width", th); mentById("bonds").appendChild()

Bonds[] = this;

h();

return this; }

th = 1 ; h = Bond_Refresh;

// Update bond line according to atom positions

function Bond_Refresh() {

var x1 = yX; var y1 = yY; var x2 = yX; var y2 = yY;

ribute("x1", x1); ribute("y1", y1); ribute("x2", x2); ribute("y2", y2); }

function RefreshScreen() { for (var I = 0; I < ; I++) { Atoms[I].fixCoords() }

for (var I = 0; I < ; I++) { Bonds[I].refresh(); } }

function FixRange(x, y, z) {

if (x < MinX) MinX = x; if (x > MaxX) MaxX = x; if (y < MinY) MinY = y; if (y > MaxY) MaxY = y; if (z < MinZ) MinZ = z; if (z > MaxZ) MaxZ = z;

XRange = MaxX - MinX YRange = MaxY - MinY ZRange = MaxZ - MinZ

Range = max(max(XRange, YRange), ZRange)

if (Range == 0) Range = Dimensions

Scale = Dimensions / Range

XOffset = XRange / 2 - MaxX YOffset = YRange / 2 - MaxY ZOffset = ZRange / 2 - MaxZ }

function max(a, b) { if (a > b) return a else return b }

function min(a, b) { if (a < b) return a else return b }

Mouse_LastX = null

Mouse_LastY = null

Mouse_dX = null

Mouse_dY = null

function MouseDown(MouseEvent) { Mouse_LastX = eenX() Mouse_LastY = eenY() Mouse_dX = 0 Mouse_dY = 0 ThrownTheta = 0

ThrownPhi = 0 if (!(Rotating)) { Rotating = true Rotate() } }

function MouseMove(MouseEvent) { if ((Mouse_LastX != null) && (Mouse_LastY != null)) { Mouse_dX = ((1.0 - MouseMoveAverage) * Mouse_dX) + (MouseMoveAverage * ((eenX() - Mouse_LastX) * MouseScalar)) Mouse_dY = ((1.0 - MouseMoveAverage) * Mouse_dY) + (MouseMoveAverage * ((eenY() - Mouse_LastY) * MouseScalar))

Theta -= Mouse_dX Phi -= Mouse_dY

Mouse_LastX = eenX() Mouse_LastY = eenY() } }

function MouseUp(MouseEvent) { if ((Mouse_LastX != null) && (Mouse_LastY != null)) { ThrownTheta = Mouse_dX ThrownPhi = Mouse_dY if ((ThrownTheta < MinMouseSpeed) && (ThrownTheta > (MinMouseSpeed * -1)) && (ThrownPhi < MinMouseSpeed) && (ThrownPhi > (MinMouseSpeed * -1))) { ThrownTheta = 0 ThrownPhi = 0 } } Mouse_LastX = null Mouse_LastY = null }

function Rotate() { MovementMade = false

for (var I = 0; I < ; I++) { JustMoved = Atoms[I].refresh() MovementMade = MovementMade || JustMoved }

for (var I = 0; I < ; I++) {

Bonds[I].refresh(); }

Theta -= ThrownTheta Phi -= ThrownPhi if ((MovementMade) || (ThrownTheta != 0) || (ThrownPhi != 0) || (Mouse_LastX != null)) setTimeout("()", 50) else Rotating = false }

= Rotate

// Create molecule structure

function GenerateStructure() { x = 10; y = 10; z = 10; var point1 = new Atom(x, y, z, "url(#radial1)");

x = 15; y = 10; z = 10; var point2 = new Atom(x, y, z, "url(#radial2)");

x = 10; y = 15; z = 10; var point3 = new Atom(x, y, z, "url(#radial3)");

x = 10; y = 10; z = 15; var point4 = new Atom(x, y, z, "url(#radial4)");

var strength = 2;

var line1 = new Bond(point1, point2, strength); var line2 = new Bond(point1, point3, strength); var line3 = new Bond(point1, point4, strength);

RefreshScreen(); Rotate(); }

]] >

< defs >

< radialGradient id = " radial1 " cx = " 75% " cy = " 75% " r = " 50% " >

< stop offset = " 15% " stop - color = " white " />

< stop offset = " 100% " stop - color = " red " />