<vectorField/>

<vectorField/> is a Graphical component that draws a two-dimensional vector field as arrows on a lattice covering the visible region of an enclosing <graph>.

The field comes from a function with two outputs, given inside the component either as a bare expression — <vectorField>(y, -x)</vectorField> — or as a <function> child. A bare expression is read as a function of x and y; use the variables attribute to name them differently. A <function> child is used exactly as written, since it names its own variables. Like <slopeField/>, the field re-tiles as the user pans or zooms, and its arrows keep a constant on-screen length whatever the axis scaling.

Each arrow’s tail sits on the lattice point it was sampled at, so it shows the vector at that point. This differs from <slopeField/>, whose marks are centered on their lattice points because a tangent direction has no head or tail to distinguish.

Attributes and Properties

Examples

Example: A rotational field

By default arrow length is proportional to the magnitude of the vector, so the arrows grow with distance from the origin. The longest arrow currently on screen is drawn at markLength, and the rest in proportion to it, so panning or zooming to a region of larger vectors rescales them all rather than letting them run off the graph.

Example: Direction only

With normalize, every arrow is drawn the same length. This is the better choice when the shape of the flow matters more than its speed, or when magnitudes vary so widely that the small arrows vanish.

Example: A gradient field

The gradient of x^2 + y^2 points radially outward, everywhere perpendicular to the circular level curves. Here the field is defined as a separate <function> and referenced inside the component, which is the alternative to writing the expression out.

Attribute Examples

Attribute Example: variables

variables names the inputs of a bare expression, in order: the horizontal axis first, then the vertical. It defaults to x y, so an equation written in those letters needs nothing. It has no effect on a <function> child, which names its own variables — writing both warns, since one of them cannot be doing anything.

The names may themselves be references, exactly as on a <function>, so a student can choose them:

The field is (r, -q) whichever axis each letter names, so swapping the two boxes — r in the first, q in the second — turns the clockwise rotation (y, -x) into (x, -y), which flows away from the vertical axis instead of circling the origin.

Attribute Example: dx, dy

dx and dy set the lattice spacing, one unit each by default. A finer lattice usually wants a shorter markLength, and a thinner lineWidth: a field is drawn in the component’s selected style, and the default style’s line is 4 pixels wide, which is more than an arrow this short needs even before the lattice is crowded. styleNumber="2" gives a thinner line as well, and recolors it.

Attribute Example: markLength

markLength is measured in pixels, and defaults to 24. When arrows scale with magnitude it sets the length of the longest arrow on screen; with normalize it sets the length of every arrow.

Attribute Example: maxMarks

maxMarks bounds how many arrows are drawn, and defaults to 2500. Rather than refusing to draw when the lattice would exceed it, the field keeps every n-th lattice line.

Property Examples

Property Example: dx, dy, normalize

Each attribute of <vectorField/> is also available as a property of a named vector field.