We developed this new widget so that any site can embed the “New York City Council Find My District” Map.

Embed this widget on your website to help the people in your community find their Council District.

Copy the following HTML code and paste it into your blog or website’s HTML.

Advanced Options

The widget uses the City’s Geoclient API.

To embed this widget into a responsive layout, wrap the <iframe> in a div with the .repsonsive-embed class:

<div class="repsonsive-embed">
    <iframe width="315" height="560" src="https://council.nyc.gov/map-widget/" frameborder="0" allowfullscreen></iframe>
</div>

And add the following code to your CSS:

.responsive-embed {
    position: relative;
    height: 0;
    margin-bottom: 1rem;
    padding-bottom: 75%; // change this to adjust the height/width ratio
    overflow: hidden;
}
.responsive-embed iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}