Chapter 5 Interactive component
5.1 New Interactive Features:
In order to have a better understanding of overall long-term trend of Average Part Weight among products inspected by Machine I4, our team will use d3.js to add a interactive feature, showing the Date and Average Part Weight Difference Ratio from Target for each point along the line. For d3.js part, we firstly create a tooltip and attach the appropriate Mouseover, Mousemove, and Mouseout event functions to dynamically move and change the visibility of a tooltip and help display the data values as the text. That newly added feature will help the user obtain the exact value of each data point without going back to check the data table anymore, and it could draw user’s attention while providing additional information.
5.2 Instructions for users:
When the user moves the mouse pointer over the point along the line, the Date and Average Part Weight Difference Ratio from Target values will be displayed near the point in a black box. In addition, nothing will show on the graph when the mouse is away from the any point on the line.