c3-axis.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. //[c3 charts Javascript]
  2. //Project: Riday Admin - Responsive Admin Template
  3. //Primary use: Used only for the morris charts
  4. $(function () {
  5. "use strict";
  6. var a = c3.generate({
  7. bindto: "#axis-rotated",
  8. size: { height: 350 },
  9. color: { pattern: ["#689f38", "#38649f"] },
  10. data: {
  11. columns: [
  12. ["data1", 150, 350, 190, 500, 400, 240],
  13. ["data2", 60, 160, 45, 60, 45, 65]
  14. ],
  15. types: { data1: "bar" }
  16. },
  17. axis: { rotated: !0 },
  18. grid: { y: { show: !0 } }
  19. });
  20. var t = c3.generate({
  21. bindto: "#axis-category",
  22. size: { height: 350 },
  23. color: { pattern: ["#38649f", "#689f38"] },
  24. data: {
  25. columns: [
  26. ["data", 120, 350, 185, 450, 90, 158, 90, 150, 302]
  27. ]
  28. },
  29. axis: { x: { type: "data", categories: ["2010", "2011", "2012", "2013", "2014", "2015", "2016", "2017", "2018"] } },
  30. grid: { y: { show: !0 } }
  31. });
  32. var i = c3.generate({
  33. bindto: "#axis-tick-culling",
  34. size: { height: 350 },
  35. color: { pattern: ["#389f99", "#ee1044"] },
  36. data: {
  37. columns: [
  38. ["data", 10, 252, 125, 421, 131, 269, 45, 352, 142, 425, 125, 248, 41, 212, 154, 424, 136]
  39. ]
  40. },
  41. axis: { x: { type: "category", tick: { culling: { max: 10 } } } },
  42. grid: { y: { show: !0 } }
  43. });
  44. var i = c3.generate({
  45. bindto: "#axis-tick-fitting",
  46. size: { height: 350 },
  47. color: { pattern: ["#ff8f00", "#689f38"] },
  48. data: {
  49. x: "x",
  50. columns: [
  51. ["x", "2018-04-21", "2018-03-21", "2018-02-21", "2018-01-21", "2017-12-21", "2017-11-21", "2017-10-21"],
  52. ["data", 254, 512, 158, 41, 154, 548, 215]
  53. ]
  54. },
  55. axis: { x: { type: "timeseries", tick: { fit: !0, format: "%e %b %y" } } },
  56. grid: { y: { show: !0 } }
  57. });
  58. var t = c3.generate({
  59. bindto: "#axis-timezone",
  60. size: { height: 350 },
  61. color: { pattern: ["#673ab7", "#4974e0"] },
  62. data: {
  63. x: "x",
  64. xFormat: "%Y",
  65. columns: [
  66. ['x', '2010-12-22', '2011-12-24', '2012-12-28', '2013-12-31', '2014-01-01', '2015-01-02', '2016-01-03', '2017-01-04', '2018-01-05'],
  67. ['x', '2010', '2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018'],
  68. ['data1', 50, 250, 125, 452, 189, 269, 548, 125, 65],
  69. ['data2', 142, 324, 245, 562, 268, 345, 412, 214, 32]
  70. ]
  71. },
  72. axis: { x: { type: "timeseries", localtime: !1, tick: { format: "%Y-%m-%d %H:%M:%S" } } },
  73. grid: { y: { show: !0 } }
  74. });
  75. var o = c3.generate({
  76. bindto: "#y-axis",
  77. size: { height: 350 },
  78. color: { pattern: ["#2196f3", "#ef0065"] },
  79. data: {
  80. columns: [
  81. ["sample", 30, 200, 100, 400, 150, 2500]
  82. ]
  83. },
  84. axis: { y: { tick: { format: d3.format("$,") } } },
  85. grid: { y: { show: !0 } }
  86. });
  87. var n = c3.generate({
  88. bindto: "#range-y-axis",
  89. size: { height: 350 },
  90. color: { pattern: ["#3f51b5", "#faa700"] },
  91. data: {
  92. columns: [
  93. ["sample", 30, -200, 100, 300, 150, -250, 350, 150, 400, -50]
  94. ]
  95. },
  96. axis: { y: { max: 400, min: -400 } },
  97. grid: { y: { show: !0 } }
  98. });
  99. });