Angular 4 with Plotly

Question

I am trying to build an angular 4 application that needs graph.

I am planning to use plotly, but I am not getting any clear site showing the steps or the w

Answer 1

There is now an official Angular wrapper for plot.ly

npm install angular-plotly.js plotly.js

Add plotly to your main app module:

import { PlotlyModule } from 'angular-plotly.js';

@NgModule({
    imports: [CommonModule, PlotlyModule],
    ...
})
export class AppModule { }

Can then add the graph to a component like this:

@Component({
    selector: 'plotly-example',
    template: '',
})
export class PlotlyExampleComponent {
    public graph = {
        data: [
            { x: [1, 2, 3], y: [2, 6, 3], type: 'scatter', mode: 'lines+points', marker: {color: 'red'} },
            { x: [1, 2, 3], y: [2, 5, 3], type: 'bar' },
        ],
        layout: {width: 320, height: 240, title: 'A Fancy Plot'}
    };
}