-
Notifications
You must be signed in to change notification settings - Fork 3
Moving objects by scripts
Aaron Amran edited this page Aug 4, 2023
·
63 revisions
The objective is to add scripts to Meclib widgets, which allow the control of the sketch by interactively dragging control points. Here is a jsfiddle example
The general procedure is as follows
- create Meclib objects
[ [ "grid", "", "", 0, 6, 0, 5, 40], [ "fix12", "A", [1, 1], 0], [ "fix12", "B", [5, 1], 0], [ "bar", "", [1,1], [3,3]], [ "bar", "", [5,1], [3,3]], [ "force", "F", [3,3], [3,4 ]] ]
- Create shortcuts for objects you want to control
var B = objects[2]; var A = objects[1]; var AC = objects[3]; var CB = objects[4]; var F = objects[5];
- Create interactive control points. Here we copy the positions from the meclib objects,
XY()
is an internal meclib functionvar pA = board.create("point", XY(A.p1), {fixed:false}); var pB = board.create("point", XY(B.p1), {fixed:false}); var pC = board.create("point", XY(AC.p2), {fixed:false}); var pF = board.create("point", XY(F.p2), {fixed:false});
- Create callbacks for the control points
pA.on('drag', function(e) { A.p1.moveTo(XY(pA)); AC.p1.moveTo(XY(pA)); }); pB.on('drag', function(e) { B.p1.moveTo(XY(pB)); CB.p1.moveTo(XY(pB)); }); pC.on('drag', function(e) { AC.p2.moveTo(XY(pC)); CB.p2.moveTo(XY(pC)); F.p1.moveTo(XY(pC));}); pF.on('drag', function(e) { F.p2.moveTo(XY(pF)); });
Interactivity legend:
- "Switch": object can be activated or deactivated by double-click.
- "Move": object or it's control points can be dragged around with the mouse.
- "Delete": object can be deleted by double-click (if active)
- "Generate": object can generate "force" or "moment" objects by dragging sample objects with the mouse.
Return value: only relevant for interactive input
Not all objects are meant to be animated, as it depends on the purpose of their functionalities.
Restrictions:
-
"beam": works only for single part beams. Multipart beams would be controlled by a list of points
p[0]
,p[1]
, ...
Work in progress:
- dashpot (p1,p2) (done)
- dim (p1,p2)
- dir (p1,p2) (done)
- disp (p1,p2) (done)
- fixXX (refactoring) (done)
- line (x, y vectors)?
- polygon (p.vertex[i])?
- rope (p1,p2) center points
- springc (p1, p2)
- springt (p1, p2)
Objects with generic control
- bar (p1, p2)
- circle (pc)
- force (p1, p2)
- label (p1)
- mass (p1)
- moment (p1, p2, p3)
- node (p1)
- point (p1)
- rot (p1, p2, p3)
The input for the images in the table are found here
Object | Interactivity | Return value in names
|
Example | moveTo( ) points |
---|---|---|---|---|
"angle", "angle1", "angle2" | label string |
p1 (center), p2 , p3
|
||
"axes" | ||||
"bar" | Switch | "show" or list of load indices if hidden |
p1 , p2
|
|
"beam" | Switch | state | ||
"circle" | Switch | state |
p1 (circle midpoint) |
|
"circle2p" | Move | [x1,y1],[x2,y2] | ||
"crosshair" | Move | [x,y] (scaled) | ||
"dashpot" | Switch | "show" or list of load indices if hidden |
p1 , p2
|
|
"dim" | label string | |||
"dir" | label string |
p1 , p2
|
||
"disp" | label string |
p1 , p2
|
||
"fix1", "fix12", "fix123", "fix13" | Switch | "show" or list of load indices if hidden | p1 |
|
"force" | Move, delete | expression |
p1 , p2
|
|
"forceGen" | Generate | 0 | ||
"frame" | 0 | |||
"grid" | 0 | |||
"label" | 0 | p1 |
||
"line" | 0 | |||
"line2p" | Move | [x1,y1],[x2,y2] | ||
"mass" | 0 | p1 |
||
"moment" | Move, delete | expression | ||
"momentGen" | Generate | 0 | ||
"node" | label string | p1 |
||
"point" | label string | p1 |
||
"polygon" | Switch | state |
p1 (polygon midpoint) |
|
"q" | Switch | "show" or list of load indices if hidden | ||
"rope" | Switch | "show" or list of load indices if hidden | ||
"rot" | label string | |||
"spline" | Move | expression f(x) | ||
"springc" | Switch | "show" or list of load indices if hidden |
p1 , p2
|
|
"springt" | Switch | "show" or list of load indices if hidden |
p1 , p2
|
|
"wall" | Switch | "show" or list of load indices if hidden |
In order to try code snippets in jsfiddle,
- copy the code from the wiki page to the clipboard
- follow the link for the JSXGraph version you want to try
- Replace the code in the HTML section (contents of
<p hidden id="init">
) with the content of the clipboard