SERV-2286 - added linechart samples

src/Views/Limitless/Help/Layout/Master.blade.php

@@ -42,7 +42,7 @@
 
             @Limitless::SideNavMenuSectionTitle(['title' => 'Charts'])
             @Limitless::SideNavMenuItem(['url' => '?page=Linechart', 'target' => '_self', 'icon' => 'icon-statistics', 'title' => 'Line chart'])
-            @Limitless::SideNavMenuItem(['url' => '?page=Areachart', 'target' => '_self', 'icon' => 'icon-chart', 'title' => 'Area chart'])
+            @Limitless::SideNavMenuItem(['url' => '?page=Barchart', 'target' => '_self', 'icon' => 'icon-stats-bars3', 'title' => 'Bar chart'])
 
             @Limitless::SideNavMenuSectionTitle(['title' => 'Navigations'])
             @Limitless::SideNavMenuItem(['url' => '?page=Sidenav', 'target' => '_self', 'icon' => 'icon-sort', 'title' => 'Side Navigation'])

src/Views/Limitless/Linechart/Documentation/Index.blade.php

@@ -7,22 +7,30 @@
 
         // sample backend data
         $categories = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
-        $series = ['ONC', 'APR', 'SPR', 'PHX', 'SIG', 'BRG', 'MNT', 'SDK', 'OCT'];
+        $series = ['ONC', 'APR', 'SPR', 'PHX'];
 
         $seriesData = [];
+        $multichartSeriesData = [];
         foreach ($series as $s) {
-            $data['name'] = $s;
+            $data['name'] = $multiData['name'] = $s;
             $dataArray = [];
             foreach ($categories as $c) {
                $dataArray[] = rand(1,100);
             }
-            $data['data'] = $dataArray;
+            $data['data'] = $multiData['data'] = $dataArray;
             $data['index'] = 0; //rand(0,1); on what chart index to add.
+            $multiData['index'] = rand(0,1);
+
             $seriesData[] = $data;
+            $multichartSeriesData[] = $multiData;
         }
 
         // json string data should be valid else it will return null
         $rawData = '{
+           "color":["#8dd3c7", "#ffffb3"],
+           "textStyle":{
+                "color":"#fff"
+           },
            "xAxis":{
               "type":"category",
               "boundaryGap":false,
@@ -49,15 +57,51 @@
         ])
     @Limitless::CardStop
 
-    @Limitless::CardStart(['title' => "Chart 2  (raw)", 'icon' => 'icon-info22' ] )
+    @Limitless::CardStart(['title' => "Area Setup", 'icon' => 'icon-info22' ] )
         @Limitless::LineChart([
-            'raw' => $rawData
+            'is-area' => true,
+            'stacked' => true,
+            'categories' => $categories,
+            'series' => $seriesData,
+        ])
+    @Limitless::CardStop
+
+    @Limitless::CardStart(['title' => "Inverted Setup", 'icon' => 'icon-info22' ] )
+        @Limitless::LineChart([
+            'inverted' => true,
+            'categories' => $categories,
+            'series' => $seriesData,
+        ])
+    @Limitless::CardStop
+
+    @Limitless::CardStart(['title' => "Multi Chart Setup", 'icon' => 'icon-info22' ] )
+        @Limitless::LineChart([
+            'titles' => ['Chart 1', 'Chart 2'],
+            'charts' => 2,
+            'show-values' => true,
+            'categories' => $categories,
+            'series' => $multichartSeriesData,
         ])
     @Limitless::CardStop
 
-{{--    @Limitless::CardStart(['title' => "Chart 3", 'icon' => 'icon-info22' ] )--}}
-{{--        @Limitless::LineChartStart--}}
-{{--        @Limitless::LineChartStop--}}
-{{--    @Limitless::CardStop--}}
+    @Limitless::CardStart(['title' => "Advanced Setup", 'icon' => 'icon-info22' ] )
+        @Limitless::LineChart([
+            'titles' => 'Chart 1',
+            'show-values' => true,
+            'y-axis-label-value-format' => '{value} users',
+            'data-zoom' => true,
+            'boundary-gap' => false,
+            'animation-duration' => 2000,
+            'colors' => ['#8dd3c7', '#ffffb3', '#bebada', '#fb8072', '#80b1d3', '#fdb462', '#b3de69', '#fccde5', '#d9d9d9', '#bc80bd', '#ccebc5', '#ffed6f'],
+            'categories' => $categories,
+            'series' => $seriesData,
+        ])
+    @Limitless::CardStop
+
+    @Limitless::CardStart(['title' => "Raw Setup", 'icon' => 'icon-info22' ] )
+        @Limitless::LineChart([
+            'raw' => $rawData
+        ])
+    @Limitless::CardStop
 
 @stop