JSON to Table<\/title>\n <script>\n \/\/ Function to load and display the JSON data\n function loadJSON(url) {\n fetch(url)\n .then(response => {\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n return response.json();\n })\n .then(data => {\n \/\/ Start building the table\n let table = '<table border=\"1\"><thead><tr><th>Key<\/th><th>Values<\/th><\/tr><\/thead><tbody>';\n \n \/\/ Iterate over each key in the object\n Object.keys(data).forEach(key => {\n table += '<tr>';\n table += `<td>${key}<\/td>`;\n \n const value = data[key];\n \n \/\/ Check if the value is an object or a string\n if (typeof value === 'object' && value !== null) {\n \/\/ If it's an object, create a nested table\n table += '<td><table border=\"1\">';\n \n Object.keys(value).forEach(subKey => {\n table += `<tr><td>${subKey}<\/td><td>${value[subKey]}<\/td><\/tr>`;\n });\n \n table += '<\/table><\/td>';\n } else if (typeof value === 'string') {\n \/\/ If it's a string, just display the string\n table += `<td><a href=\"${value}\" target=\"_blank\">${value}<\/a><\/td>`;\n } else {\n \/\/ Handle other data types if necessary\n table += `<td>${value}<\/td>`;\n }\n \n table += '<\/tr>';\n });\n \n table += '<\/tbody><\/table>';\n \n \/\/ Append the table to the DOM\n document.getElementById('jsonTable').innerHTML = table;\n })\n .catch(error => console.error('Error loading JSON:', error));\n }\n\n \/\/ Function to get a parameter value from the query string\n function getQueryParam(param) {\n const urlParams = new URLSearchParams(window.location.search);\n return urlParams.get(param);\n }\n\n \/\/ Call the function when the window loads\n window.onload = function() {\n \/\/ Get the JSON URL from the query string\n const matchreport_pdf_url = getQueryParam('matchreport_pdf_url');\n const tracking_video_url = getQueryParam('tracking_video_url');\n const scenario_json_url = getQueryParam('scenario_json_url');\n console.log(matchreport_pdf_url, tracking_video_url, scenario_json_url);\n \n document.getElementById('result_part').innerHTML =\n `\n <h1>Match Report<\/h1> \n <iframe src=\"https:\/\/docs.google.com\/gview?url=${matchreport_pdf_url}&embedded=true\" style=\"width:800px;height:1150px;\" frameborder=\"0\"><\/iframe>\n <h1>Analyzed Match Video<\/h1> \n <p><video width=\"800px\" controls><source src=\"${tracking_video_url}\" type=\"video\/mp4\"><\/video><\/p>\n <h1>Scenario Json<\/h1> \n <p><a href=\"${scenario_json_url}\">Download<\/a><\/p>\n `;\n\n \/\/ If a URL was provided, load the JSON from that URL\n \/\/ if (matchreport_pdf_Url) {\n \/\/ \/\/ loadJSON(jsonUrl);\n \/\/ } else {\n \/\/ console.error('No URL provided in query string.');\n \/\/ }\n };\n <\/script>\n<\/head>\n<body>\n <div id=\"result_part\"><\/div>\n<\/body>\n<\/html>","protected":false},"excerpt":{"rendered":"<p>JSON to Table<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"class_list":["post-10973","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/comments?post=10973"}],"version-history":[{"count":25,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973\/revisions"}],"predecessor-version":[{"id":11024,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973\/revisions\/11024"}],"wp:attachment":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/media?parent=10973"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":10973,"date":"2024-08-29T09:51:51","date_gmt":"2024-08-29T09:51:51","guid":{"rendered":"https:\/\/saiva001.mycafe24.com\/?page_id=10973"},"modified":"2024-08-29T13:30:20","modified_gmt":"2024-08-29T13:30:20","slug":"analysis-result-page-test2","status":"publish","type":"page","link":"https:\/\/augmentedbrainlabs.com\/de\/analysis-result-page-test2\/","title":{"rendered":"Analysis Result"},"content":{"rendered":"\n\n\n \n \n JSON to Table<\/title>\n <script>\n \/\/ Function to load and display the JSON data\n function loadJSON(url) {\n fetch(url)\n .then(response => {\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n return response.json();\n })\n .then(data => {\n \/\/ Start building the table\n let table = '<table border=\"1\"><thead><tr><th>Key<\/th><th>Values<\/th><\/tr><\/thead><tbody>';\n \n \/\/ Iterate over each key in the object\n Object.keys(data).forEach(key => {\n table += '<tr>';\n table += `<td>${key}<\/td>`;\n \n const value = data[key];\n \n \/\/ Check if the value is an object or a string\n if (typeof value === 'object' && value !== null) {\n \/\/ If it's an object, create a nested table\n table += '<td><table border=\"1\">';\n \n Object.keys(value).forEach(subKey => {\n table += `<tr><td>${subKey}<\/td><td>${value[subKey]}<\/td><\/tr>`;\n });\n \n table += '<\/table><\/td>';\n } else if (typeof value === 'string') {\n \/\/ If it's a string, just display the string\n table += `<td><a href=\"${value}\" target=\"_blank\">${value}<\/a><\/td>`;\n } else {\n \/\/ Handle other data types if necessary\n table += `<td>${value}<\/td>`;\n }\n \n table += '<\/tr>';\n });\n \n table += '<\/tbody><\/table>';\n \n \/\/ Append the table to the DOM\n document.getElementById('jsonTable').innerHTML = table;\n })\n .catch(error => console.error('Error loading JSON:', error));\n }\n\n \/\/ Function to get a parameter value from the query string\n function getQueryParam(param) {\n const urlParams = new URLSearchParams(window.location.search);\n return urlParams.get(param);\n }\n\n \/\/ Call the function when the window loads\n window.onload = function() {\n \/\/ Get the JSON URL from the query string\n const matchreport_pdf_url = getQueryParam('matchreport_pdf_url');\n const tracking_video_url = getQueryParam('tracking_video_url');\n const scenario_json_url = getQueryParam('scenario_json_url');\n console.log(matchreport_pdf_url, tracking_video_url, scenario_json_url);\n \n document.getElementById('result_part').innerHTML =\n `\n <h1>Match Report<\/h1> \n <iframe src=\"https:\/\/docs.google.com\/gview?url=${matchreport_pdf_url}&embedded=true\" style=\"width:800px;height:1150px;\" frameborder=\"0\"><\/iframe>\n <h1>Analyzed Match Video<\/h1> \n <p><video width=\"800px\" controls><source src=\"${tracking_video_url}\" type=\"video\/mp4\"><\/video><\/p>\n <h1>Scenario Json<\/h1> \n <p><a href=\"${scenario_json_url}\">Download<\/a><\/p>\n `;\n\n \/\/ If a URL was provided, load the JSON from that URL\n \/\/ if (matchreport_pdf_Url) {\n \/\/ \/\/ loadJSON(jsonUrl);\n \/\/ } else {\n \/\/ console.error('No URL provided in query string.');\n \/\/ }\n };\n <\/script>\n<\/head>\n<body>\n <div id=\"result_part\"><\/div>\n<\/body>\n<\/html>","protected":false},"excerpt":{"rendered":"<p>JSON to Table<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"class_list":["post-10973","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/comments?post=10973"}],"version-history":[{"count":25,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973\/revisions"}],"predecessor-version":[{"id":11024,"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/pages\/10973\/revisions\/11024"}],"wp:attachment":[{"href":"https:\/\/augmentedbrainlabs.com\/de\/wp-json\/wp\/v2\/media?parent=10973"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}