non-date.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. <!doctype html>
  2. <head>
  3. <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  4. <script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js"></script>
  5. <script src="../morris.js"></script>
  6. <script src="http://cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.min.js"></script>
  7. <script src="lib/example.js"></script>
  8. <link rel="stylesheet" href="lib/example.css">
  9. <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.min.css">
  10. <link rel="stylesheet" href="../morris.css">
  11. </head>
  12. <body>
  13. <h1>Formatting Non-date Arbitrary X-axis</h1>
  14. <div id="graph"></div>
  15. <pre id="code" class="prettyprint linenums">
  16. var day_data = [
  17. {"elapsed": "I", "value": 34},
  18. {"elapsed": "II", "value": 24},
  19. {"elapsed": "III", "value": 3},
  20. {"elapsed": "IV", "value": 12},
  21. {"elapsed": "V", "value": 13},
  22. {"elapsed": "VI", "value": 22},
  23. {"elapsed": "VII", "value": 5},
  24. {"elapsed": "VIII", "value": 26},
  25. {"elapsed": "IX", "value": 12},
  26. {"elapsed": "X", "value": 19}
  27. ];
  28. Morris.Line({
  29. element: 'graph',
  30. data: day_data,
  31. xkey: 'elapsed',
  32. ykeys: ['value'],
  33. labels: ['value'],
  34. parseTime: false
  35. });
  36. </pre>
  37. </body>