feat: add demo of the chart template

Author: peterpeterparker

package-lock.json

@@ -36,6 +36,7 @@
     "@ionic/core": "^4.0.0-rc.0",
     "@webcomponents/custom-elements": "^1.2.1",
     "deckdeckgo": "^1.0.0-beta.18",
+    "deckdeckgo-charts": "^1.0.0-alpha.1",
     "deckdeckgo-remote": "^1.0.0-alpha.3",
     "ionicons": "^4.5.1"
   },

package.json

@@ -0,0 +1,5 @@
+01.01.2018;5;0
+01.03.2018;10;6
+01.06.2018;8;14
+01.09.2018;14;8
+01.12.2018;18;4

src/assets/csv/data-chart.csv

@@ -144,6 +144,10 @@ <h1 slot="header" style="font-weight: 300; --background: white; --color: var(--i
                 <h2 slot="footer" style="font-weight: 300; --background: white; --color: var(--ion-color-dark);">...for GIFs</h2>
             </deckgo-slide-gif>
 
+            <deckgo-slide-chart type="line" grid="true" date-pattern="dd.MM.yyyy" src="./assets/csv/data-chart.csv" ticks="5" style="--background: white;--color: black;">
+                <h1 slot="title">Or the template for charts</h1>
+            </deckgo-slide-chart>
+
             <deckgo-slide-code src="./assets/code/deckdeckgo-slide-code-example.txt" style="--code-margin-bottom: 6rem; --background: var(--ion-color-dark); --color: var(--ion-color-light); --code-color: var(--ion-color-light);">
                 <h2 slot="title">Showcase your code</h2>
             </deckgo-slide-code>

src/index.html

@@ -26,8 +26,11 @@ ioniconsElements(window);
 // Init DeckDeckGo elements
 import { defineCustomElements as deckDeckGoElements } from 'deckdeckgo/dist/loader';
 import { defineCustomElements as deckDeckGoRemoteElements } from 'deckdeckgo-remote/dist/loader';
+import { defineCustomElements as deckDeckGoChartsElements } from 'deckdeckgo-charts/dist/loader';
 
 deckDeckGoElements(window).then(async () => {
+    await deckDeckGoChartsElements(window);
+
     await postLoading();
 
     deckDeckGoRemoteElements(window).then(async () => {