npm package: @sgits/dynamic-dashboards
Description: ## Installation
Author: Martin Klasen
Latest version: 1.0.6

# dynamic-dashboards

## Installation

To install this library, run:

```bash
$npm install @sgits/dynamic-dashboards --save
```

## Consuming your library

Once you have published your library to npm, you can import your library in any Angular application by running:

```bash
$npm install @sgits/dynamic-dashboards
```

and then from your Angular `AppModule`:

```typescript
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

// Import your library
import { DynamicDashboardsModule } from '@sgits/dynamic-dashboards';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    // Specify your library as an import
    DynamicDashboardsModule.forRoot('http://www.my.api/')
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
```

Once your library is imported, you can use its components, directives and pipes in your Angular application:

```xml
<!-- You can now use your library component in app.component.html -->
<h1>
  {{title}}
</h1>
<dynamic-dashboards></dynamic-dashboards>
```

Alternativly you can route directly to the required components:

```typescript
const routes: Routes = [
    {
        path: 'login',
        component: LoginComponent,
        data: { roles: [], url: '/login', title: 'Login', icon: 'exit_to_app', show: false, seq: 0 }
    },
    {
        path: '',
        component: MainComponent,
        canActivate: [RouteGuard],
        children: [
            {
                path: '',
                component: DynamicDashboardsContainerComponent,
                canActivate: [RouteGuard],
                data: { roles: [], url: '/', title: 'Dashboards', icon: 'widgets', show: true, seq: 1 }
            },
            {
                path: 'widget-detail',
                component: DynamicWidgetDetailComponent,
                canActivate: [RouteGuard],
                data: { roles: [], url: '', title: 'Widget Detail', icon: '', show: false, seq: 0 }
            }
        ]
    },
    {
        path: '**',
        component: PageNotFoundComponent
    }
];
```

## Configure amcharts3-angular

This module requires the angular amcharts npm package to be installed and configured as per:

<https://github.com/amcharts/amcharts3-angular2>

Add amcharts to your index.html

```html
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/gauge.js"></script>
<script src="https://www.amcharts.com/lib/3/gantt.js"></script>
<script src="https://www.amcharts.com/lib/3/pie.js"></script>
<script src="https://www.amcharts.com/lib/3/amstock.js"></script>
<script src="https://www.amcharts.com/lib/3/radar.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/dark.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/tools/polarScatter/polarScatter.min.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js"></script>
<script src="https://www.amcharts.com/lib/3/ammap_amcharts_extension.js"></script>
<script src="https://www.amcharts.com/lib/3/maps/js/continentsLow.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
```

## License

Supergroup © [Martin Klasen](mailto:martin.klasen@sgits.co.za)