graph.html 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. <html>
  2. <head>
  3. <script src='https://cdn.plot.ly/plotly-2.14.0.min.js'></script>
  4. <script type="text/javascript" src="./gethost.js"></script>
  5. <script type="text/javascript" src="./readconfigcommon.js"></script>
  6. <script type="text/javascript" src="./readconfigparam.js"></script>
  7. <style>
  8. textarea {
  9. width: 600px;
  10. height: 300px;
  11. }
  12. </style>
  13. <script>
  14. function run() {
  15. var el = document.getElementById('cnsl');
  16. el && eval(el.value);
  17. }
  18. </script>
  19. </head>
  20. <body>
  21. <div id='chart'></div>
  22. <select id="datafiles" onchange="run();"></select>
  23. <select id="numbers" onchange="run();"></select>
  24. <select id="datatype" onchange="run();">
  25. <option value="3">Value</option>
  26. <option value="4">PreValue</option>
  27. <option value="5">Change-Rate</option>
  28. <option value="6">Change-Absolut</option>
  29. </select>
  30. <button onclick="document.getElementById('editor').hidden = false; this.hidden = true;" >Editor</button>
  31. <div id='editor' hidden='true'>
  32. <textarea id="cnsl">
  33. datefile = document.getElementById("datafiles").value;
  34. numbername = document.getElementById("numbers").value;
  35. datatype = document.getElementById("datatype").value;
  36. //alert("Auslesen: " + datefile + " " + numbername);
  37. _basepath = getbasepath();
  38. fetch(_basepath + '/fileserver/log/data/' + datefile)
  39. .then(response => {
  40. // handle the response
  41. if (response.status == 404) {
  42. alert("no log data available for "+dateString);
  43. }
  44. response.text()
  45. .then( result => {
  46. var lines = result.split("\n");
  47. var trace = {
  48. x: [],
  49. y: [],
  50. type: 'scatter'
  51. };
  52. var timex = 1;
  53. for (let line of lines) {
  54. {
  55. console.log(line);
  56. if (line.split("\t")[1] == numbername)
  57. {
  58. var value = line.split("\t")[datatype];
  59. var time = line.split("\t")[0];
  60. console.log("> "+time+" "+value+"\n");
  61. trace.x.push(time);
  62. // timex += 1;
  63. trace.y.push(value);
  64. }
  65. }
  66. }
  67. console.log(trace);
  68. var data = [trace];
  69. Plotly.newPlot('chart', data);
  70. });
  71. }).catch((error) => {
  72. // handle the error
  73. console.log(error);
  74. alert("test");
  75. });
  76. </textarea><br />
  77. <button onclick="run();">run</button>
  78. </div>
  79. <script>
  80. function WriteModelFiles()
  81. {
  82. list_data = getDATAList();
  83. var _indexDig = document.getElementById("datafiles");
  84. while (_indexDig.length)
  85. _indexDig.remove(0);
  86. for (var i = list_data.length - 1; i >= 0; --i)
  87. {
  88. var optionDig = document.createElement("option");
  89. var text = list_data[i];
  90. optionDig.text = text;
  91. optionDig.value = list_data[i];
  92. _indexDig.add(optionDig);
  93. }
  94. }
  95. function WriteNumbers()
  96. {
  97. list_data = getNUMBERSList();
  98. var _indexDig = document.getElementById("numbers");
  99. while (_indexDig.length)
  100. _indexDig.remove(0);
  101. for (var i = 0; i < list_data.length; ++i)
  102. {
  103. var optionDig = document.createElement("option");
  104. var text = list_data[i];
  105. optionDig.text = text;
  106. optionDig.value = list_data[i];
  107. _indexDig.add(optionDig);
  108. }
  109. }
  110. WriteModelFiles();
  111. WriteNumbers();
  112. run();
  113. </script>
  114. </body>
  115. </html>