Skip to main content

Posts

Showing posts with the label Bar Charts using Ionic 3 Angular 4

What Is Slides in Angular 4 and Ionic 3? How does Work?

The Slides component is a multi-section container and each one section can be dragged or swiped between and it also contains any number of Slides as per your applications requirements. You can use a template to create slides and slide events in the slides container i.e. /// Basic slides - Angular 4 and Ionic 3   < ion-slides pager >     < ion-slide style = "background-color: green" >       < h2 > Slide 1 </ h2 >     </ ion-slide >       < ion-slide style = "background-color: aquamarine;" >       < h2 > Slide 2 </ h2 >     </ ion-slide >       < ion-slide style = "background-color:blueviolet;" >       < h2 > Slide 3 </ h2 >     </ ion-slide > </ ion-slides > Example steps – //Slides....

How to Create Bar Charts In Angular 4 using Ionic 3 CLI?

In this blog post, I am going to share “How to create bar charts in Angular 4 using Ionic 3 CLI?”.   I hope you love this blog post.  The following steps are to achieve, Install Angular 2 Charts and Charts.js - npm install ng2 - charts -- save npm install chart . js -- save Once installation is completed, import chartsModule import { ChartsModule } from 'ng2-charts' ; After Import chartsModule, declare the charts module in imports array. import { BrowserModule } from '@angular/platform-browser' ; import { ErrorHandler , NgModule } from '@angular/core' ; import { IonicApp , IonicErrorHandler , IonicModule } from 'ionic-angular' ; import { ChartsModule } from 'ng2-charts' ; import { MyApp } from './app.component' ; import { HomePage } from '../pages/home/home' ; import { ListPage } from '../pages/list/list' ; import { LoginPage } from '../pa...