Set 'focus' Area In Nvd3.js Linewithfocuschart

I'm usuing the lineWithFocusChart.js model shown in the nvd3 examples shown here: http://nvd3.org/ghpages/examples.html I want to be able to choose a specific x range for the graph

Solution 1:

Suppose there's only one graph generated by nvd3 on the page:

chart = nv.graphs[0] // how to choose the graph by DOM id?
chart.brushExtent([10,20])
chart.update()

Thank @elsherbini's comment.

Solution 2:

The solution provided here no longer works with the newest version of NVD3. Instead, you can use the following when you create the chart:

  chart = nv.models.lineWithFocusChart()
    .options({
      brushExtent: [10000,490000]
    });

Or this after you've created it:

chart.brushExtent([10000,490000]);

See the documentation here: http://nvd3-community.github.io/nvd3/examples/documentation.html#lineWithFocusChart