React.js + D3.js multivariable chart component

The scope of the Multivariable Chart Component (MVC from now on) document is to render a chart representing the evolution over a defined period of time of one or multiple variables. The X axis SHOULD represent the time and one or multiple Y axis should be used to represent the values, according to the different number of units used by the variables. The colors that are used to represent the different variables should be displayed in a legenda. The evolution of the variables should be displayed alternatively as lines, columns, areas or any mix of the same. The chart should include the ‘brush’ functionality. This means that the User should be able to select a portion in time (moving the mouse from left to right in the time scale) and the chart should respond zooming in to the indicated time frame. The reset button should be available to rewind the chart back to the original time frame. It SHOULD also be possible for the User to point the cursor over a plotted line and see the actual value of the variable (or the variables) in that point.