Angular 5 Graphing Component
I often work on highly interactive applications and components, the constituents of which are often difficult to test and demonstrate outside of some sense of position in a physical space. The space must be represented in a browser-based environment, so we are talking about a function graph. Much of my computational work deals with physical quantities or assets that can not be negative, so a first-quadrant (non-negative x and y), multi-layer graph is sufficient. This allows the graph engine to be optimized for single-quadrant display, which results in a very lightweight implementation.
I have implemented an Angular 5 graphing component that is built on top of the Typescript Math Toolkit quadrant class (TSMT$Quadrant) and its supporting class library. This includes pre-release versions of solid/dashed/dotted line decorators for automatic line drawing without changing the underlying Canvas drawing code.
My initial thought was to restrict this engine to my client-only Angular Dev Toolkit, however, I believe the baseline code is useful for the entire Angular community. While I will continue to enhance this engine in the ADT, the baseline code is now fully open source.
Here is a quick example that uses the Typescript Math Toolkit linear regression class.
The template is extremely simple,
<adt-graph title="Typescript Math Toolkit Linear Regression" xAxisLabel="X-Data" yAxisLabel="Y-Data"></adt-graph>
More information and additional information on usage can be obtained from the Github repo and I know you want the code more than more verbiage, so point your friendly neighborhood browser here and enjoy!