---
layout: default
---

      <div class="row">
        <div class="span6">
          <div class="page-header">
            <h1>NVD3 <small>Re-usable charts for <a href="http://d3js.org">d3.js</a></small></h1>
          </div>
         <p class="lead">This project is an attempt to build re-usable charts and chart components for <a href="http://d3js.org">d3.js</a> without taking away the power that <a href="http://d3js.org">d3.js</a> gives you. This is a very young collection of components, with the goal of keeping these components very customizeable, staying away from your standard cookie cutter solutions.</p>
          <p><a class="btn btn-primary btn-large" href="ghpages/examples.html">View more examples &raquo;</a></p>
          <p><a class="btn btn-primary btn-large" href="https://github.com/novus/nvd3">GitHub Repo</a></p>
        </div>
        <div class="span6">
          <svg id="mainExample" style="height:360px"></svg>
        </div>
      </div>


      <div class="row">
        <div class="span4">
          <svg id="exampleOne" style="height:240px"></svg>
        </div>
        <div class="span4">
          <svg id="exampleTwo" style="height:240px"></svg>
        </div>
        <div class="span4">
          <svg id="exampleThree" style="height:240px"></svg>
        </div>
      </div>

      <hr>

      <h2>Getting Started</h2>
      <div class='row'>
        <div class='span4'>
          <p class='lead'>
              Download <a href="http://d3js.org/">d3.v3.js</a>. This is the only required library for NVD3.
            </p>
            <p class='lead'>
              Download the latest nv.d3.js (version 1.1 beta).
                Get the <a href="https://raw.github.com/novus/nvd3/master/nv.d3.js">development</a> version, or
                minified <a href="https://raw.github.com/novus/nvd3/master/nv.d3.min.js">production</a> version.
          </p>
          <p class='lead'>
             Don't forget the <a href="https://raw.github.com/novus/nvd3/master/src/nv.d3.css">NVD3 css file</a>!
          </p>
        </div>
        <div class='span4'>
            <p class='lead'>
            Checkout our <a href="ghpages/examples.html">examples gallery</a> for how to code your first chart.
            <br/>
            Our examples should provide you with enough code to start making beautiful charts.
            <br/><br/>
            <a href="http://www.google.com/chrome">Google Chrome</a> is our best supported browser.
             NVD3 also works in Firefox, Opera, Safari and Internet Explorer 10.
            </p>
        </div>

        <div class='span4'>
            <p class='lead'>
                Any questions or bug reports? Visit our <a href="https://github.com/novus/nvd3">GitHub</a> page.
            </p>
        </div>
      </div>

      <h2>About NVD3</h2>
      <p class='lead'>
          NVD3 is currently maintained by a team of frontend software engineers at <a href="https://www.novus.com/">Novus Partners</a>.
          Our charting technology is used to provide powerful analytics to our clients in the financial industry.
          <br/><br/>
          NVD3's codebase is heavily inspired by the work of Mike Bostock. In particular, his article <a href="http://bost.ocks.org/mike/chart/">"Towards Reusable Charts"</a> serves as our guide.
      </p>