diff --git a/pages/_data/charts.yml b/pages/_data/charts.yml
index 9c8419c992085b44e5cfcfde308556d42cc0801e..5af99a6596147c1a62f59aa67e17fa1fbc07f222 100644
--- a/pages/_data/charts.yml
+++ b/pages/_data/charts.yml
@@ -32,7 +32,7 @@ development-activity:
color: blue
data: [0, 5, 1, 2, 7, 5, 6, 8, 24, 7, 12, 5, 6, 3, 2, 2, 6, 30, 10, 10, 15, 14, 47, 65, 55]
-employment:
+line:
name: Employment Growth
display: true
type: line
@@ -49,7 +49,7 @@ employment:
color: green
data: [17, 18, 21, 20, 30, 29]
-line-chart-stroke:
+line-stroke:
name: Line chart
display: true
type: line
@@ -67,7 +67,7 @@ line-chart-stroke:
color: green
data: [7, 10, 11, 18, 18, 18, 24]
-stepline-chart:
+stepline:
name: Stepline
display: true
type: line
diff --git a/pages/_includes/cards/charts/card.html b/pages/_includes/cards/charts/card.html
new file mode 100644
index 0000000000000000000000000000000000000000..3d95c76f9c89db9b30f08aac9213fb01130cd265
--- /dev/null
+++ b/pages/_includes/cards/charts/card.html
@@ -0,0 +1,17 @@
+{% if include.data %}
+{% assign data = include.data %}
+{% else %}
+{% assign data = site.data.charts[include.name] %}
+{% endif %}
+{% assign key = 'chart-' | append: include.name %}
+
+ {% unless include.hide-title %}
+
+ {% endunless %}
+
+
+{% include js/charts.html id=key chart-id=include.name %}
diff --git a/pages/charts.html b/pages/charts.html
index 022ab4b2642c34b90304869306dbbce54b73d5d5..f31208094abb37c4f0425628815268ae0eb67509 100644
--- a/pages/charts.html
+++ b/pages/charts.html
@@ -6,18 +6,10 @@ menu: charts
{% for chart in site.data.charts %}
{% if chart[1].display %}
- {% assign data = chart[0] %}
- {% assign key = 'chart-' | append: data %}
+ {% assign chart-name = chart[0] %}
+ {% assign chart-data = chart[1] %}
-
- {% include js/charts.html id=key chart-id=data %}
+ {% include cards/charts/card.html name=chart-name data=chart-data %}
{% endif %}
{% endfor %}
diff --git a/pages/index.html b/pages/index.html
index ef6860cd3832bfdcb7c5a9a49d65514d93df4244..2d600587839ef82cc73447df99681df3c8d0eeab 100644
--- a/pages/index.html
+++ b/pages/index.html
@@ -108,6 +108,16 @@ menu: level-1.level-2.level-3.level-4
{% include cards/small-stats-3.html number=621 title="Products" percentage=-1 %}
+
+ {% include cards/charts/card.html name="line" title="A" %}
+
+
+ {% include cards/charts/card.html name="stepline" title="B" %}
+
+
+ {% include cards/charts/card.html name="temperature" title="C" %}
+
+
{% comment %}
{% comment %}{% include cards/development-activity.html %}{% endcomment %}