<regionBetweenCurveXAxis>

<regionBetweenCurveXAxis> is a Graphical component that renders a shaded region on a graph between a specified function and the $x$-axis.

Attributes and Properties

Example: Render shading between a function and the x-axis

The <regionBetweenCurveXAxis> component shades in the region between a function and the $x$-axis over a specified interval.

Attribute Example: function

<graph size="small" xmin="-1" xmax="6" ymin="-3">
  <function name="f">x^2</function>
  <regionBetweenCurveXAxis function="$f" boundaryValues="0 3"/>
</graph>

The function attribute takes a named function reference as input.

Attribute Example: boundaryValues

<slider name="upperLimit" from="-pi" to="pi" step="pi/8"/>
<graph size="small" xmin="-2pi" xmax="2pi" ymin="-2" ymax="2" xTickScaleFactor="pi">
  <function name="f" styleNumber="2">sin(x)</function>
  <regionBetweenCurveXAxis 
    name="shadedRegion" 
    function="$f" 
    boundaryValues="-pi $upperLimit" 
    styleNumber="2"
  />
</graph>     
 
<p><c>boundaryValues</c> = $shadedRegion.boundaryValues</p>

The boundaryValues attribute accepts a list of $x$-values or numerical references that define the endpoints of the shaded interval.

Attribute Example: styleNumber

<slider name="styleNum" from="1" to="6" step="1"/>
 
<graph size="small" xmin="-1" xmax="6" ymin="-3">
  <function name="f">x^2</function>
  <regionBetweenCurveXAxis 
    function="$f" 
    boundaryValues="0 3" 
    styleNumber="$styleNum"
  />
</graph>      

The <regionBetweenCurveXAxis> component accepts the styleNumber attribute. Default styleNumbers range from $1$ to $6$.

Property Example: styleDescription/ styleDescriptionWithNoun

Since users can override styles and so may see different colors and line styles, don’t directly refer to the colors and line styles you create. Instead, use the properties styleDescription and styleDescriptionWithNoun. With those properties, the text will change to match the displayed styles.