diff --git a/index.android.js b/index.android.js
index b06e2e1..ed2c44e 100644
--- a/index.android.js
+++ b/index.android.js
@@ -4,91 +4,121 @@
  * @flow
  */
 
-import React, { Component } from 'react';
-import {
-  AppRegistry,
-  StyleSheet,
-  Text,
-  View
-} from 'react-native';
-import ChartView from './App/index.js';
+/**
+ * Issue - How to display loading animation before showing chart
+ * Solution by @BismarkAmanor
+ * @flow
+ */
 
-export default class chartWebView extends Component {
+import React, { Component } from "react";
+import { AppRegistry, ActivityIndicator } from "react-native";
+import ChartView from "./App/index.js";
 
-  constructor(props){
+export default class chartWebView extends Component {
+  constructor(props) {
     super(props);
+    this.state = {
+      timePassed: false, //BismarkAmanor- default timer state
+    };
   }
-    render() {
-    var Highcharts='Highcharts';
-    var conf={
-            chart: {
-                type: 'spline',
-                animation: Highcharts.svg, // don't animate in old IE
-                marginRight: 10,
-                events: {
-                    load: function () {
 
-                        // set up the updating of the chart each second
-                        var series = this.series[0];
-                        setInterval(function () {
-                            var x = (new Date()).getTime(), // current time
-                                y = Math.random();
-                            series.addPoint([x, y], true, true);
-                        }, 1000);
-                    }
-                }
-            },
-            title: {
-                text: 'Live random data'
-            },
-            xAxis: {
-                type: 'datetime',
-                tickPixelInterval: 150
-            },
-            yAxis: {
-                title: {
-                    text: 'Value'
-                },
-                plotLines: [{
-                    value: 0,
-                    width: 1,
-                    color: '#808080'
-                }]
-            },
-            tooltip: {
-                formatter: function () {
-                    return '<b>' + this.series.name + '</b><br/>' +
-                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
-                        Highcharts.numberFormat(this.y, 2);
-                }
-            },
-            legend: {
-                enabled: false
-            },
-            exporting: {
-                enabled: false
-            },
-            series: [{
-                name: 'Random data',
-                data: (function () {
-                    // generate an array of random data
-                    var data = [],
-                        time = (new Date()).getTime(),
-                        i;
+  // BismarkAmanor- executing timer function when app is rendered
+  componentDidMount() {
+    this.setTimeout(() => {
+      this.setTimePassed();
+    }, 1000);
+  }
+
+  render() {
+    var Highcharts = "Highcharts";
+    var conf = {
+      chart: {
+        type: "spline",
+        animation: Highcharts.svg, // don't animate in old IE
+        marginRight: 10,
+        events: {
+          load: function () {
+            // set up the updating of the chart each second
+            var series = this.series[0];
+            setInterval(function () {
+              var x = new Date().getTime(), // current time
+                y = Math.random();
+              series.addPoint([x, y], true, true);
+            }, 1000);
+          },
+        },
+      },
+      title: {
+        text: "Live random data",
+      },
+      xAxis: {
+        type: "datetime",
+        tickPixelInterval: 150,
+      },
+      yAxis: {
+        title: {
+          text: "Value",
+        },
+        plotLines: [
+          {
+            value: 0,
+            width: 1,
+            color: "#808080",
+          },
+        ],
+      },
+      tooltip: {
+        formatter: function () {
+          return (
+            "<b>" +
+            this.series.name +
+            "</b><br/>" +
+            Highcharts.dateFormat("%Y-%m-%d %H:%M:%S", this.x) +
+            "<br/>" +
+            Highcharts.numberFormat(this.y, 2)
+          );
+        },
+      },
+      legend: {
+        enabled: false,
+      },
+      exporting: {
+        enabled: false,
+      },
+      series: [
+        {
+          name: "Random data",
+          data: (function () {
+            // generate an array of random data
+            var data = [],
+              time = new Date().getTime(),
+              i;
+
+            for (i = -19; i <= 0; i += 1) {
+              data.push({
+                x: time + i * 1000,
+                y: Math.random(),
+              });
+            }
+            return data;
+          })(),
+        },
+      ],
+    };
+
+    // BismarkAmanor- Update timer state
+    setTimePassed = () => {
+      this.setState({ timePassed: true });
+    };
 
-                    for (i = -19; i <= 0; i += 1) {
-                        data.push({
-                            x: time + i * 1000,
-                            y: Math.random()
-                        });
-                    }
-                    return data;
-                }())
-            }]
-        };
-    return (
-      <ChartView style={{flex:1}} config={conf} stock={false}></ChartView>
-    );
+    // BismarkAmanor- display loading animation if timePassed state is false
+    if (this.state.timePassed) {
+      return <ActivityIndicator size="small" color="#0000ff" />;
+    } else {
+      return (
+        <ChartView style={{ flex: 1 }} config={conf} stock={false}></ChartView>
+      );
+    }
   }
 }
-AppRegistry.registerComponent('chartWebView', () => chartWebView);
+AppRegistry.registerComponent("chartWebView", () => chartWebView);
diff --git a/index.ios.js b/index.ios.js
index 359c678..ed2c44e 100644
--- a/index.ios.js
+++ b/index.ios.js
@@ -1,94 +1,124 @@
 /**
-* Sample React Native App
-* https://github.com/facebook/react-native
-* @flow
-*/
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ * @flow
+ */
 
-import React, { Component } from 'react';
-import {
-   AppRegistry,
-   StyleSheet,
-   Text,
-   View
-} from 'react-native';
-import ChartView from './App/index.js';
+/**
+ * Issue - How to display loading animation before showing chart
+ * Solution by @BismarkAmanor
+ * @flow
+ */
 
-export default class chartWebView extends Component {
+import React, { Component } from "react";
+import { AppRegistry, ActivityIndicator } from "react-native";
+import ChartView from "./App/index.js";
 
-   constructor(props){
+export default class chartWebView extends Component {
+  constructor(props) {
     super(props);
+    this.state = {
+      timePassed: false, //BismarkAmanor- default timer state
+    };
   }
-    render() {
-    var Highcharts='Highcharts';
-    var conf={
-            chart: {
-                type: 'spline',
-                animation: Highcharts.svg, // don't animate in old IE
-                marginRight: 10,
-                events: {
-                    load: function () {
 
-                        // set up the updating of the chart each second
-                        var series = this.series[0];
-                        setInterval(function () {
-                            var x = (new Date()).getTime(), // current time
-                                y = Math.random();
-                            series.addPoint([x, y], true, true);
-                        }, 1000);
-                    }
-                }
-            },
-            title: {
-                text: 'Live random data'
-            },
-            xAxis: {
-                type: 'datetime',
-                tickPixelInterval: 150
-            },
-            yAxis: {
-                title: {
-                    text: 'Value'
-                },
-                plotLines: [{
-                    value: 0,
-                    width: 1,
-                    color: '#808080'
-                }]
-            },
-            tooltip: {
-                formatter: function () {
-                    return '<b>' + this.series.name + '</b><br/>' +
-                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
-                        Highcharts.numberFormat(this.y, 2);
-                }
-            },
-            legend: {
-                enabled: false
-            },
-            exporting: {
-                enabled: false
-            },
-            series: [{
-                name: 'Random data',
-                data: (function () {
-                    // generate an array of random data
-                    var data = [],
-                        time = (new Date()).getTime(),
-                        i;
+  // BismarkAmanor- executing timer function when app is rendered
+  componentDidMount() {
+    this.setTimeout(() => {
+      this.setTimePassed();
+    }, 1000);
+  }
+
+  render() {
+    var Highcharts = "Highcharts";
+    var conf = {
+      chart: {
+        type: "spline",
+        animation: Highcharts.svg, // don't animate in old IE
+        marginRight: 10,
+        events: {
+          load: function () {
+            // set up the updating of the chart each second
+            var series = this.series[0];
+            setInterval(function () {
+              var x = new Date().getTime(), // current time
+                y = Math.random();
+              series.addPoint([x, y], true, true);
+            }, 1000);
+          },
+        },
+      },
+      title: {
+        text: "Live random data",
+      },
+      xAxis: {
+        type: "datetime",
+        tickPixelInterval: 150,
+      },
+      yAxis: {
+        title: {
+          text: "Value",
+        },
+        plotLines: [
+          {
+            value: 0,
+            width: 1,
+            color: "#808080",
+          },
+        ],
+      },
+      tooltip: {
+        formatter: function () {
+          return (
+            "<b>" +
+            this.series.name +
+            "</b><br/>" +
+            Highcharts.dateFormat("%Y-%m-%d %H:%M:%S", this.x) +
+            "<br/>" +
+            Highcharts.numberFormat(this.y, 2)
+          );
+        },
+      },
+      legend: {
+        enabled: false,
+      },
+      exporting: {
+        enabled: false,
+      },
+      series: [
+        {
+          name: "Random data",
+          data: (function () {
+            // generate an array of random data
+            var data = [],
+              time = new Date().getTime(),
+              i;
+
+            for (i = -19; i <= 0; i += 1) {
+              data.push({
+                x: time + i * 1000,
+                y: Math.random(),
+              });
+            }
+            return data;
+          })(),
+        },
+      ],
+    };
+
+    // BismarkAmanor- Update timer state
+    setTimePassed = () => {
+      this.setState({ timePassed: true });
+    };
 
-                    for (i = -19; i <= 0; i += 1) {
-                        data.push({
-                            x: time + i * 1000,
-                            y: Math.random()
-                        });
-                    }
-                    return data;
-                }())
-            }]
-        };
-    return (
-      <ChartView style={{flex:1}} config={conf} stock={false}></ChartView>
-    );
+    // BismarkAmanor- display loading animation if timePassed state is false
+    if (this.state.timePassed) {
+      return <ActivityIndicator size="small" color="#0000ff" />;
+    } else {
+      return (
+        <ChartView style={{ flex: 1 }} config={conf} stock={false}></ChartView>
+      );
+    }
   }
 }
-AppRegistry.registerComponent('chartWebView', () => chartWebView);
+AppRegistry.registerComponent("chartWebView", () => chartWebView);
diff --git a/package.json b/package.json
index 63fcfc9..10d934d 100644
--- a/package.json
+++ b/package.json
@@ -1,8 +1,7 @@
 {
   "name": "react-native-highcharts",
   "version": "1.1",
-  "description":
-    "JavaScript implementation of a view container that can flip between its front and back, where the back has a console.log and the front is your aplication.",
+  "description": "JavaScript implementation of a view container that can flip between its front and back, where the back has a console.log and the front is your aplication.",
   "main": "react-native-highcharts.js",
   "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start",