---
layout: api
title: "v2.2.0 JavaScript Library: L.Rectangle"
categories: api
version: v2.2.0
permalink: /api/v2.2.0/l-rectangle/
---
<h2 id="rectangle">Rectangle</h2>

<p>A class for drawing rectangle overlays on a map. Extends <a href="/mapbox.js/api/v2.2.0/l-polygon">Polygon</a>. Use <a href="/mapbox.js/api/v2.2.0/l-map">Map#addLayer</a> to add it to the map.</p>

<h3>Usage example</h3>
<pre><code class="javascript">// define rectangle geographical bounds
var bounds = [[54.559322, -5.767822], [56.1210604, -3.021240]];

// create an orange rectangle
L.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);

// zoom the map to the rectangle bounds
map.fitBounds(bounds);</code></pre>

<h3>Creation</h3>

<table data-id='rectangle'>
	<tr>
<th class="width250">Factory</th>

<th>Description</th>
	</tr>
	<tr>
<td><code><b>L.rectangle</b>(
<nobr>&lt;<a href="/mapbox.js/api/v2.2.0/l-latlngbounds">LatLngBounds</a>&gt; <i>bounds</i></nobr>,
<nobr>&lt;<a href="/mapbox.js/api/v2.2.0/l-path">Path options</a>&gt; <i>options?</i> )</nobr>
</code></td>


<td>Instantiates a rectangle object with the given geographical bounds and optionally an options object.</td>
	</tr>
</table>

<h3>Methods</h3>

<p>You can use <a href="/mapbox.js/api/v2.2.0/l-path">Path methods</a> and additionally the following methods:</p>

<table data-id='rectangle'>
	<tr>
<th class="width250">Method</th>
<th>Returns</th>
<th>Description</th>
	</tr>
	<tr>
<td><code><b>setBounds</b>(
<nobr>&lt;<a href="/mapbox.js/api/v2.2.0/l-latlngbounds">LatLngBounds</a>&gt; <i>bounds</i> )</nobr>
</code></td>

<td><code><span class="keyword">this</span></code></td>
<td>Redraws the rectangle with the passed bounds.</td>
	</tr>
</table>


