From d53e7f21870b9e9386c2e0f664c5338beafefc5f Mon Sep 17 00:00:00 2001 From: Shreyas Fadnavis Date: Tue, 26 Apr 2016 23:24:32 +0530 Subject: [PATCH] Create comparisons-chart(like_weather_stats).html A mix of few features in one file which people often have a problem navigating with initially while using Morris.js. Aimed at the developers who want to use the library for analytical data representation via comparisons --- ...comparisons-chart(like_weather_stats).html | 37 +++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 examples/comparisons-chart(like_weather_stats).html diff --git a/examples/comparisons-chart(like_weather_stats).html b/examples/comparisons-chart(like_weather_stats).html new file mode 100644 index 00000000..cc976a97 --- /dev/null +++ b/examples/comparisons-chart(like_weather_stats).html @@ -0,0 +1,37 @@ + + + + + + + + + + + + +

Area chart to Display a comparison between Temperature and Humidity

+
+
+Morris.Area({
+  element: 'graph',
+  behaveLikeLine: true,//-->to remove the additive nature which the chart has by default. This is not easily found in the documentation.
+  data: [//the data is sample
+      { y: '2014', a: 50, b: 90},
+      { y: '2015', a: 65,  b: 85},
+      { y: '2016', a: 50,  b: 50},
+      { y: '2017', a: -75,  b: 60},//can handle negative values
+      { y: '2018', a: 80,  b: 85},
+      { y: '2019', a: 90,  b: 70},
+      { y: '2020', a: -100, b: 75},
+      { y: '2021', a: 115, b: 75},
+      { y: '2022', a: 120, b: 65},
+      { y: '2023', a: 145, b: 85},
+      { y: '2024', a: 160, b: -95}
+    ],
+  xkey: 'y',
+  ykeys: ['a', 'b'],
+  labels: ['Temperature', 'Humidity']
+});
+
+