axes_x_range_timeseries.html 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <html>
  2. <head>
  3. <link rel="stylesheet" type="text/css" href="../css/c3.css">
  4. </head>
  5. <body>
  6. <div id="chart1"></div>
  7. <div id="chart2"></div>
  8. <script src="https://d3js.org/d3.v5.min.js" charset="utf-8"></script>
  9. <script src="../js/c3.js"></script>
  10. <script>
  11. var chart1 = c3.generate({
  12. "bindto": "#chart1",
  13. "axis": {
  14. "x": {
  15. "type": "timeseries",
  16. "min": 1401879600000,
  17. "max": 1401969600000,
  18. }
  19. },
  20. "data": {
  21. "type": "line",
  22. "columns": [
  23. ["epoch", 1401879600000, 1401883200000, 1401886800000],
  24. ["y", 1955, 2419, 2262]
  25. ],
  26. "xs": {
  27. "y": "epoch"
  28. }
  29. }
  30. });
  31. var chart2 = c3.generate({
  32. "bindto": "#chart2",
  33. "axis": {
  34. "x": {
  35. "type": "timeseries",
  36. "min": new Date(1401879600000),
  37. "max": new Date(1401969600000),
  38. }
  39. },
  40. "data": {
  41. "type": "line",
  42. "columns": [
  43. ["epoch", 1401879600000, 1401883200000, 1401886800000],
  44. ["y", 1955, 2419, 2262]
  45. ],
  46. "xs": {
  47. "y": "epoch"
  48. }
  49. }
  50. });
  51. </script>
  52. </body>
  53. </html>