ReferenceconstrainTo

<constrainTo>

Constrains a graphical component's position to be within another component or components

<constrainTo> is a Graphical component to constrain a <point> to another named graphical component (such as a <line> or a <function>).

Attributes and Properties

Attributes for <constrainTo>

Other (1)
relativeToGraphScales

boolean. Default value: false. Whether the constraint is interpreted relative to the enclosing graph's scales.

Common to all components (9)
copy

reference. Create an independent copy of another component by reference. Enter a references a $name.

disabled

boolean. Default value: false. Whether this component is disabled and cannot be interacted with.

extend

reference. Extend another component by reference, inheriting its children and attributes. Enter a reference as $name.

fixed

boolean. Default value: false. Whether this component's value is fixed and cannot be modified.

fixLocation

boolean. Default value: false. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

hide

boolean. Default value: false. Whether to hide this component from the rendered output.

isResponse

boolean. Default value: false. Whether this component is treated as a response for the purposes of assessment.

name

text. The name used to reference this component from elsewhere in the document.

styleNumber

integer. Default value: 1. The style number used to select this component's visual styling from the available style definitions.

Properties for <constrainTo name="c">

Other (5)
$c.disabled

boolean. Whether this component is disabled and cannot be interacted with.

$c.fixed

boolean. Whether this component's value is fixed and cannot be modified.

$c.fixLocation

boolean. Whether this component's location is fixed (preventing it from being moved while still allowing other modifications).

$c.hidden

boolean. Whether this component is hidden from the rendered output.

$c.relativeToGraphScales

boolean. Whether the constraint is interpreted relative to the enclosing graph's scales.

Common to all components (4)
$c.doenetML

text. The DoenetML source code that produced this component.

$c.hide

boolean. Whether to hide this component from the rendered output.

$c.isResponse

boolean. Whether this component is treated as a response for the purposes of assessment.

$c.styleNumber

integer. The style number used to select this component's visual styling from the available style definitions.

Examples

Example: Constrain a <point> to a <circle>

The <point> named car is constrained to the <circle> named raceTrack using the <constrainTo> component.


Example: Constrain a <circle> to a <line>

To constrain geometric objects other than points, first define a named <point> with the desired constraint, and then reference that point within the definition of the geometric object. The original <point> can be hidden using the hide attribute.


Example: Construct a draggable tangent <line>

A tangent <line> to a <function> is defined by referencing a constrained <point> in the <through> attribute of the <line> component.

The slope of the <line> as the user drags the <point> is computed by evaluating the <derivative> of the named <function> at the referenced x property of the <point>.