Google Chart Angular 5+
A component to implement the Google Chart on your Angular 5+ applications.
Features of Google Chart Angular 5+
- Inbuild Google Library Loading All related library and packages will be loaded through component
- Option Changes Aware Any changes made to Google Option Object
Screenshot of Google Chart
chartType– Type of Chart. For example:
LineChart, ScatterChart, AreaChart, BarChart, BubbleChart, CandlestickChart, ColumnChart, ComboChart, PieChart, Gantt,Gauge, GeoChart, Histogram, OrgChart, Sankey, SteppedAreaChart, Table, Timeline, TreeMap, WordTree, Calendar, Map
dataPromise– Promise to fetch data
options– Google Chart Option Object Google Chart Customization
config– Chart additional configuration object. For example, chart data does not have header & starts with row only then set
onInit– Event which will be fired when angular chart component will be initialized with
ChartWrapper. It will return
div– dynamic generated div Id for reference &
wrapper– Reference to
ChartWrapperto make changes and modify chart configuration and data manually
onReady– Event which fires every time chart is rendered & ready with new data or options. This event has no parameters.
onError– Event which fires on error while rendering chart.
onSelect– Event which will ne called on selecting data points on chart
angular-google-chart.config JSON file which has following configuration options:
packages– Packages to load. This is depend on chart type you use.
mapsApiKey– Google Developer API Key in order to access google map JS API.
As we know, visual representation of any data is worth thousands of lines written as a text, and also it will be time-consuming to make judgments after reading sophisticated data. Charts are Visual Representation Tools that make things easy to understand in an easy manner.
- Column Chart
- Bar Chart
- Pie Chart
- Line Chart
- Bubble Chart
- Doughnut Chart
- Combined Chart
For More Angular Jquery Plugins And Download Click