# C1.Blazor.Chart.RangeZone

## Content

<div class="doc-site-dotnet-api-container">



  <h1 id="C1_Blazor_Chart_RangeZone" data-uid="C1.Blazor.Chart.RangeZone" class="text-break">RangeZone Class
</h1>
  <div class="markdown level0 summary"><p>Represents a rectangular zone that highlights a specified data range on the <a class="xref" href="C1.Blazor.Chart.FlexChart.html">FlexChart</a>.</p>
</div>
  <div class="markdown level0 conceptual"></div>
  <div class="inheritance">
    <h5>Inheritance</h5>
    <div class="level0"><a class="xref" href="https://learn.microsoft.com/dotnet/api/system.object">object</a></div>
    <div class="level1"><a class="xref" href="https://learn.microsoft.com/dotnet/api/microsoft.aspnetcore.components.componentbase">ComponentBase</a></div>
    <div class="level2"><a class="xref" href="C1.Chart.SeriesBase.html">SeriesBase</a></div>
    <div class="level3"><a class="xref" href="C1.Blazor.Chart.Series.html">Series</a></div>
    <div class="level4"><span class="xref">RangeZone</span></div>
  </div>
  <div class="implements">
    <h5>Implements</h5>
    <div><a class="xref" href="https://learn.microsoft.com/dotnet/api/microsoft.aspnetcore.components.icomponent">IComponent</a></div>
    <div><a class="xref" href="https://learn.microsoft.com/dotnet/api/microsoft.aspnetcore.components.ihandleevent">IHandleEvent</a></div>
    <div><a class="xref" href="https://learn.microsoft.com/dotnet/api/microsoft.aspnetcore.components.ihandleafterrender">IHandleAfterRender</a></div>
    <div><a class="xref" href="https://learn.microsoft.com/dotnet/api/system.idisposable">IDisposable</a></div>
    <div><span class="xref">IRangeZone</span></div>
    <div><span class="xref">ISeries</span></div>
    <div><span class="xref">IStyleProvider</span></div>
  </div>
  <h6><strong>Namespace</strong>: <a class="xref" href="C1.Blazor.Chart.html">C1.Blazor.Chart</a></h6>
  <h6><strong>Assembly</strong>: C1.Blazor.Chart.dll</h6>
  <h5 id="C1_Blazor_Chart_RangeZone_syntax">Syntax</h5>
  <div class="codewrapper">
    <pre><code class="lang-csharp hljs">public class RangeZone : Series, IComponent, IHandleEvent, IHandleAfterRender, IDisposable, IRangeZone, ISeries, IStyleProvider</code></pre>
  </div>
  <div class="codewrapper">
    <pre><code class="lang-vbnet hljs">Public Class RangeZone
    Inherits Series
    Implements IComponent, IHandleEvent, IHandleAfterRender, IDisposable, IRangeZone, ISeries, IStyleProvider</code></pre>
  </div>
  <h5 id="C1_Blazor_Chart_RangeZone_remarks"><strong>Remarks</strong></h5>
  <div class="markdown level0 remarks"><p>A <a class="xref" href="C1.Blazor.Chart.RangeZone.html">RangeZone</a> is defined by the <a class="xref" href="C1.Blazor.Chart.RangeZone.MinX.html#C1_Blazor_Chart_RangeZone_MinX">MinX</a>, <a class="xref" href="C1.Blazor.Chart.RangeZone.MaxX.html#C1_Blazor_Chart_RangeZone_MaxX">MaxX</a>,
<a class="xref" href="C1.Blazor.Chart.RangeZone.MinY.html#C1_Blazor_Chart_RangeZone_MinY">MinY</a> and <a class="xref" href="C1.Blazor.Chart.RangeZone.MaxY.html#C1_Blazor_Chart_RangeZone_MaxY">MaxY</a> properties, which specify the zone's bounds in
data coordinates. Any bound left at <a class="xref" href="https://learn.microsoft.com/dotnet/api/system.double.nan">NaN</a> (the default) extends the zone
to the corresponding edge of the axis, so a zone can span a range on one axis while covering
the full extent of the other.</p>
<p>
Because <a class="xref" href="C1.Blazor.Chart.RangeZone.html">RangeZone</a> derives from the chart series type, it is added to the
chart's <a class="xref" href="C1.Blazor.Chart.FlexChart.Series.html#C1_Blazor_Chart_FlexChart_Series">Series</a> collection like any other series.
</p>
</div>
  <h5 id="C1_Blazor_Chart_RangeZone_examples"><strong>Examples</strong></h5>
  <p>The following example adds a range zone that highlights the region where X is
between 2 and 5 and Y is between 10 and 20:</p>
<pre><code class="lang-csharp">var zone = new RangeZone { Name = "Red Zone", MinX = 2, MaxX = 5, MinY = 10, MaxY = 20 };
zone.Style = "fill:red;";
chart.Series.Add(zone);</code></pre>

  <h3 id="constructors">Constructors
</h3>
  <table class="table table-bordered table-condensed">
    <thead>
      <tr>
        <th>Name</th>
        <th>Description</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone__ctor" data-uid="C1.Blazor.Chart.RangeZone.#ctor">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.-ctor.html#C1_Blazor_Chart_RangeZone__ctor">RangeZone()</a>
        </td>
        <td class="markdown level1 summary"><p>Creates an instance of RangeZone class.</p>
</td>
      </tr>
    </tbody>
  </table>
  <h3 id="properties">Properties
</h3>
  <table class="table table-bordered table-condensed">
    <thead>
      <tr>
        <th>Name</th>
        <th>Description</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_MaxX" data-uid="C1.Blazor.Chart.RangeZone.MaxX">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.MaxX.html#C1_Blazor_Chart_RangeZone_MaxX">MaxX</a>
        </td>
        <td class="markdown level1 summary"><p>Gets or sets the range maximum by X coordinate.</p>
</td>
      </tr>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_MaxY" data-uid="C1.Blazor.Chart.RangeZone.MaxY">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.MaxY.html#C1_Blazor_Chart_RangeZone_MaxY">MaxY</a>
        </td>
        <td class="markdown level1 summary"><p>Gets or sets the range maximum by Y coordinate.</p>
</td>
      </tr>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_MinX" data-uid="C1.Blazor.Chart.RangeZone.MinX">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.MinX.html#C1_Blazor_Chart_RangeZone_MinX">MinX</a>
        </td>
        <td class="markdown level1 summary"><p>Gets or sets the range minimum by X coordinate.</p>
</td>
      </tr>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_MinY" data-uid="C1.Blazor.Chart.RangeZone.MinY">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.MinY.html#C1_Blazor_Chart_RangeZone_MinY">MinY</a>
        </td>
        <td class="markdown level1 summary"><p>Gets or sets the range minimum by Y coordinate.</p>
</td>
      </tr>
    </tbody>
  </table>
  <h3 id="methods">Methods
</h3>
  <table class="table table-bordered table-condensed">
    <thead>
      <tr>
        <th>Name</th>
        <th>Description</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_GetChartType" data-uid="C1.Blazor.Chart.RangeZone.GetChartType">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.GetChartType.html#C1_Blazor_Chart_RangeZone_GetChartType">GetChartType()</a>
        </td>
        <td class="markdown level1 summary"><p>Gets the chart type.</p>
</td>
      </tr>
      <tr>
        <td id="C1_Blazor_Chart_RangeZone_GetValues_System_Int32_" data-uid="C1.Blazor.Chart.RangeZone.GetValues(System.Int32)">
          <a class="xref" href="C1.Blazor.Chart.RangeZone.GetValues.html#C1_Blazor_Chart_RangeZone_GetValues_System_Int32_">GetValues(int)</a>
        </td>
        <td class="markdown level1 summary"><p>Gets the point data array for the specified coordinate dimension.</p>
</td>
      </tr>
    </tbody>
  </table>

</div>