Как использовать щелчок мышью и перетаскивание для увеличения D3

Я новичок в D3 и хотел бы реализовать щелчок -перетаскивание -масштабирование, подобное тому, что показано здесь :http://www.highcharts.com/demo/line-time-series

. У меня уже есть линейный график, который я построил, но я не понимаю, как это реализовать.

Я предполагаю, что мне нужны обработчики событий JS, чтобы найти, где происходит мой mousedown и mouseup. Но как мне создать затенение, которое появляется на графике, когда пользователь перетаскивает?