From b02c090d03d2be7005c325311c18edbd59e32d4b Mon Sep 17 00:00:00 2001
From: Malar Kannan <malarkannan.p@gmail.com>
Date: Mon, 2 Jul 2018 00:01:28 +0530
Subject: [PATCH] add multiple lines if number of charts are more

---
 public/config.json  | 9 +++++++++
 src/ChartLoader.tsx | 4 ++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/public/config.json b/public/config.json
index ae1402f..bb5f035 100644
--- a/public/config.json
+++ b/public/config.json
@@ -28,6 +28,15 @@
     {
       "fileName": "data.csv",
       "chartColumn": "age"
+    }, {
+      "fileName": "data.csv",
+      "chartColumn": "status"
+    }, {
+      "fileName": "data.csv",
+      "chartColumn": "status"
+    }, {
+      "fileName": "data.csv",
+      "chartColumn": "status"
     }
   ],
   "colorMaps": {
diff --git a/src/ChartLoader.tsx b/src/ChartLoader.tsx
index 9f5e3a8..912f33c 100644
--- a/src/ChartLoader.tsx
+++ b/src/ChartLoader.tsx
@@ -6,11 +6,11 @@ export default class ChartLoader extends React.Component<any, any> {
   public render() {
     const colorMaps = this.props.colorMaps;
     return (
-      <Columns isCentered={true}>
+      <Columns isCentered={true} isMultiline={true}>
         {this.props.chartList.map((o: any, i: number) => {
           const colorMap = colorMaps[o.chartColumn];
           return (
-            <Column key={i} isSize={3}>
+            <Column key={i} isSize={4}>
               <Chart csvFile={o.fileName} chartColumn={o.chartColumn} colorMap={colorMap} />
             </Column>
           );