{"id":1900,"date":"2024-08-11T10:21:35","date_gmt":"2024-08-11T01:21:35","guid":{"rendered":"https:\/\/www.gassensor.kr\/?p=1900"},"modified":"2024-08-16T08:55:54","modified_gmt":"2024-08-15T23:55:54","slug":"real-time-check","status":"publish","type":"post","link":"https:\/\/www.gassensor.kr\/?p=1900","title":{"rendered":"\ud638\ud761\uae30 \ud14c\uc2a4\ud2b8 (\uc774\uc804\ubc84\uc804)"},"content":{"rendered":"<p><span id=\"userlist\"><\/span><span id=\"data_num\"><\/span><button id=\"get_data\">\ub370\uc774\ud130\uac00\uc838\uc624\uae30<\/button><br \/>\n<span id=\"gas_type\"><\/span><span id=\"graph_mode\"><\/span><button id=\"plot_data\">\uadf8\ub798\ud504 \uc0c8\ub85c\uadf8\ub9ac\uae30<\/button><\/p>\n<div id=\"msg\"><\/div>\n<div id=\"output_graph\"><\/div>\n<p><script src=\"https:\/\/cdn.plot.ly\/plotly-latest.min.js\"><\/script><br \/>\n<script>\njQuery(document).ready(function(){\n  var user_id = '';\n  let res_json = {};\n  if (Object.keys(res_json).length == 0) {\n    jQuery(\"#gas_type\").hide();\n    jQuery(\"#graph_mode\").hide();\n    jQuery(\"#plot_data\").hide();\n  }\n  let user_json = [{\"id\": \"case1\", \"name\": \"User1\"},{\"id\": \"case2\", \"name\": \"User2\"},{\"id\": \"case3\", \"name\": \"User3\"},{\"id\": \"case4\", \"name\": \"User4\"},{\"id\": \"case5\", \"name\": \"User5\"}];\n  let data_json = [{\"id\": \"100\", \"name\": \"\ucd5c\uadfc100\uac1c\"},{\"id\": \"500\", \"name\": \"\ucd5c\uadfc500\uac1c\"},{\"id\": \"1000\", \"name\": \"\ucd5c\uadfc1000\uac1c\"},{\"id\": \"1500\", \"name\": \"\ucd5c\uadfc1500\uac1c\"},{\"id\": \"2000\", \"name\": \"\ucd5c\uadfc2000\uac1c\"}];\n  let gas_json = [{\"id\": \"Temp\", \"name\": \"Temperature\" },{\"id\": \"Humid\", \"name\": \"Humidity\" },{\"id\": \"VOC\", \"name\": \"VOC\" },{\"id\": \"CO2\", \"name\": \"CO2\" }, {\"id\": \"NH3\", \"name\": \"NH3\" }, {\"id\": \"MQ131\", \"name\": \"Air Quaility\" }];\n  let gas_mode = [{\"id\": \"t-y\", \"name\": \"y vs t\"}, {\"id\": \"y-dydt\", \"name\": \"dydt vs y\"}, {\"id\": \"y-ddyddt\", \"name\": \"ddyddt vs y\"}, {\"id\": \"dydt-ddyddt\", \"name\": \"d2y\/dt2 vs dy\/dt\"}];\n  jQuery(\"#userlist\").html(selectJsonMenu(user_json,\"userlist_choice\",default_user(user_id)));\n  jQuery(\"#data_num\").html(selectJsonMenu(data_json,\"datanum_choice\",1));\n  jQuery(\"#gas_type\").html(selectJsonMenu(gas_json,\"gas_choice\",2));\n  jQuery(\"#graph_mode\").html(selectJsonMenu(gas_mode,\"graph_choice\",0));\n  jQuery(\"#get_data\").click(function(){\n    let user_choice = jQuery(\"#userlist_choice\").val();\n    let data_choice = jQuery(\"#datanum_choice\").val();\n    jQuery(\"#msg\").html(\"\ub370\uc774\ud130\ub97c \ubd88\ub7ec\ub4e4\uc774\uace0 \uc788\uc2b5\ub2c8\ub2e4.\");\n    jQuery.ajaxSetup({ timeout:20000 });\n    jQuery.get(\"https:\/\/www.gassensor.kr\/relay.php?device=\" + user_choice + \"&num=\" + data_choice, function(res){\n      res_json = JSON.parse(res);\n      console.log(res_json);\n      data_plot(jQuery(\"#gas_choice\").val(), graph_setting(jQuery(\"#graph_choice\").val()), res_json);\n      jQuery(\"#gas_type\").show();\n      jQuery(\"#graph_mode\").show();\n      jQuery(\"#plot_data\").show();\n      jQuery(\"#msg\").html(\"\ub370\uc774\ud130\ub97c \ubaa8\ub450 \ubd88\ub7ec\uc654\uc2b5\ub2c8\ub2e4. \uadf8\ub798\ud504 \ubaa8\ub4dc\ub97c \ubc14\uafb8\uc5b4 \uc0c8\ub85c \uadf8\ub9b4 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\");\n    });\n  });\n  jQuery(\"#plot_data\").click(function(){\n    console.log(graph_setting(jQuery(\"#graph_choice\").val()));\n    jQuery(\"#msg\").html(\"\uc0c8\ub85c \uadf8\ub798\ud504\ub97c \uadf8\ub9b4 \uc900\ube44\ub97c \ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.\");\n    data_plot(jQuery(\"#gas_choice\").val(), graph_setting(jQuery(\"#graph_choice\").val()), res_json);\n    jQuery(\"#msg\").html(\"\uc0c8\ub85c \uadf8\ub798\ud504\ub85c \ud45c\ud604 \ud588\uc2b5\ub2c8\ub2e4. \ub2e4\ub978 \uadf8\ub798\ud504 \ubaa8\ub4dc\ub97c \ubc14\uafb8\uc5b4 \uc0c8\ub85c \uadf8\ub9b4 \uc218 \uc788\uc2b5\ub2c8\ub2e4.\");\n  });\n});\nfunction default_user(id){\n  let choice = 0;\n  if (id === 'gassensor') choice = 4;\n  if (id === 'yeeuni220') choice = 1;\n  if (id === 'jolee') choice = 0;\n  return choice;\n}\nfunction graph_setting(mode){\n  if (mode == \"t-y\") return {\"x\": \"t\", \"y\": \"v\"};  \n  if (mode == \"y-dydt\") return {\"x\": \"v\", \"y\": \"dvdt\"};  \n  if (mode == \"y-ddyddt\") return {\"x\": \"v\", \"y\": \"ddyddt\"};  \n  if (mode == \"dydt-ddyddt\") return {\"x\": \"dvdt\", \"y\": \"ddyddt\"}; \n}\nfunction selectJsonMenu(json_array,id,init_index){\n  var menu = '<select id=\"' + id + '\">';\n  for (var i = 0; i < json_array.length; i++) {\n    if (i == init_index) {\n      menu += '<option value=\"' + json_array[i].id + '\" selected>' + json_array[i].name + '<\/option>';\n    } else {\n      menu += '<option value=\"' + json_array[i].id + '\">' + json_array[i].name + '<\/option>';\n    }\n  }\n  menu += '<\/select>';\n  return menu;\n}\nfunction data_plot(choice, graphmode_json, data_json){\n  var traces = [];\n  var trace = {\n     x: data_json[choice][graphmode_json['x']],\n     y: data_json[choice][graphmode_json['y']],\n     mode: 'markers',\n     type: 'scatter',\n     marker: { size : 10 }\n\/\/     mode: 'scatter' \/\/ lines'\n  };\n  var layout = {    \/\/ https:\/\/plotly.com\/javascript\/axes\/\n      height: 500,\n      xaxis: {\n         title: graphmode_json['x']\n      },\n      yaxis: {\n         title: graphmode_json['y']\n      },\n      margin: { t: 50 } \n  };\n  traces.push(trace);\n  Plotly.newPlot('output_graph', traces, layout);\n}\n<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p> [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"inline_featured_image":false},"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/posts\/1900"}],"collection":[{"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1900"}],"version-history":[{"count":57,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/posts\/1900\/revisions"}],"predecessor-version":[{"id":2026,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=\/wp\/v2\/posts\/1900\/revisions\/2026"}],"wp:attachment":[{"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1900"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1900"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gassensor.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1900"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}