{"id":237335,"date":"2021-01-27T16:09:07","date_gmt":"2021-01-27T15:09:07","guid":{"rendered":"https:\/\/emariete.com\/?p=237335"},"modified":"2021-01-27T16:09:07","modified_gmt":"2021-01-27T15:09:07","slug":"co2-meter-on-large-screen-large-screen","status":"publish","type":"post","link":"https:\/\/emariete.com\/en\/medidor-co2-en-pantalla-grande\/","title":{"rendered":"CO2 on a giant screen for bars, restaurants, classrooms and the like."},"content":{"rendered":"<p class=\"wp-block-paragraph\">There are many people who are looking for a <strong>CO2 meter with large display<\/strong> that can be seen from a distance for installation on <strong>catering, schools, gymnasiums and the like<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The truth is that the system is <strong>so flexible<\/strong> which, as you will see below, not only allows for the creation of huge display panels (from 5\u2033 mobiles to 7\u2033 tablets, 12.9\u2033 iPads up to <strong>100\u2033 Smart TVs<\/strong>), but it is possible to create extremely small screens, <strong>like the floating teacher window I show below<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">During this time I have carried out <strong>various prototypes and experiments<\/strong> with different types of displays. I have used large seven-segment LED displays, matrix panels, addressable panels, etc.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The problem I was facing was, on the one hand, the <strong>rigidity <\/strong>(each person has different tastes and needs and it would have been necessary to adapt the system to many different types of hardware) on the other hand the <strong>construction difficulty<\/strong> and the <strong>cost<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Finally, I said to myself<strong>why not take advantage of the fact that the CO2 meter has a complete integrated web server and use it for display on all types of screens?<\/strong>?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Said and done, I rolled up my sleeves, I got to work and today I bring you the result...<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">It's not finished yet, but I want to give you a taste of what's to come.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">My knowledge of CSS (I know my way around it, but I haven't mastered it) makes it go slower than I would like, and gives me a lot more work than necessary. <\/p>\n\n\n\n<p class=\"has-pale-cyan-blue-background-color has-background wp-block-paragraph\"><strong>If you have CSS knowledge and want to collaborate, please write me through the Telegram group. <\/strong>With a little help we can achieve something very, <span style=\"text-decoration: underline;\">very attractive and interesting<\/span> and many people in need will be able to benefit from it.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1.jpeg\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1810\" src=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1.jpeg\" alt=\"\" class=\"wp-image-237430\" srcset=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1.jpeg 2560w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1-300x212.jpeg 300w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1-1024x724.jpeg 1024w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1-768x543.jpeg 768w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1-1536x1086.jpeg 1536w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup3-scaled-1-2048x1448.jpeg 2048w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/a><figcaption>CO\u2082 Meter on monitor or TV<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-beneficios-del-co-en-pantalla-grande\">Benefits of CO\u2082 on the big screen<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Being <strong>based on HTML, CSS, and JavaScript (the web technologies)<\/strong>There are many benefits to be gained from this large screen display system.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Apart from the obvious benefit, which is possible <strong>viewing information remotely<\/strong>we would have the following:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Great <strong>flexibility <\/strong>content and design<\/li><li><strong>No investment<\/strong>. There is no need to <span style=\"text-decoration: underline;\">no more<\/span> than the homemade CO\u2082 meter on this blog (and the device where you want to display it, of course).<\/li><li>Adaptable to all types of <strong>devices<\/strong> (Phones, tablets, computers, Smart TV, etc.).<\/li><li>Possibility of design <strong>responsive<\/strong> (self-adaptation to the display device).<\/li><li>Multiple <strong>simultaneous clients<\/strong>.<\/li><li>Possibility of <strong>integrating other sources of information<\/strong>.<\/li><li>Complete freedom of choice <strong>colours, sizes, fonts<\/strong>etc.<\/li><li>System <strong>fully autonomous <\/strong>(no internet connection required)<\/li><li><strong>No library dependencies <\/strong>such as jQuery or others.<\/li><li><strong>Customisable logo <\/strong>(I take everything) easily.<\/li><li>Possibility to define <strong>several pages with different layouts<\/strong>.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-posibilidades-del-medidor-de-co-en-pantalla-grande\">Possibilities of the CO\u2082 meter on large display<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Although, for the time being, it is only a prototype (<strong>I will soon publish instructions and the necessary files<\/strong>On this page, so that you can do the same), the visualisation system already has the following functionalities:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Display of <strong>any parameter <\/strong>emissions from the CO\u2082 meter (such as temperature and humidity, in these examples).<\/li><li>Real-time visualisation <strong>without reloading the page<\/strong>.<\/li><li>Display of <strong>historical graphs <\/strong>(from Thingspeak or others).<\/li><li><strong>Colour change<\/strong>according to the level of CO\u2082 (<strong>traffic light effect<\/strong>) with <strong>user adjustable levels<\/strong>.<\/li><li>Possibility of displaying <strong>external data<\/strong>.<\/li><\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Of all of them, which will be useful to one person or another, I think that the most interesting and useful for everyone is that <strong>the display always shows the current CO\u2082 value. You don't need to reload the page or press any buttons to get the current data.<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-dispositivos-de-visualizaci-n\">Display devices<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">There are many devices on which CO2 visualisation is possible. Whether you need a small stand-alone system, with a tablet, for example, for medium-sized spaces such as a <strong>Large format TV, for large venues<\/strong>you always have a choice.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-tablets\">Tablets<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The tablet is the display device par excellence.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">There are really cheap Android tablets, even older tablets, that you may not use anymore, that you can use for this, giving them <strong>a new youth<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">They are ideal to put them on <strong>fixed to the wall with some kind of bracket<\/strong>like this one:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><p >No products found.<\/p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-smart-tv\">Smart TV <\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Most Smart TVs in recent years support HTML, CSS and JavaScript (internet technologies) so it will be very easy to use them as a CO\u2082 display device.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This is a perfect solution for <strong>really big rooms<\/strong> where we need information to be seen from all points.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">We can put a SmartTV from <strong>4K and 58\u2033<\/strong>for relatively little money than <strong>will be seen from far away<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><p >No products found.<\/p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-tv-normales-con-la-ayuda-de-por-ejemplo-un-amazon-fire-tv-stick\">regular TVs (with the help of, for example, an Amazon Fire TV Stick)<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">If you have a slightly older television, or <strong>any monitor with HDMI input<\/strong>You can use it to display CO\u2082 levels using, for example, a Fire TV Stick:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><p >No products found.<\/p><\/p>\n\n\n<div class=\"gb-container gb-container-a1d8b90e\"><div class=\"gb-inside-container\">\n\n<h3 class=\"wp-block-heading\" id=\"h-equipos-de-profesor-monitor-supervisor-etc\">Teams of teacher, monitor, supervisor, etc.<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\" id=\"h-en-ocasiones-es-importante-que-el-profesor-monitor-supervisor-etc-tenga-acceso\">It's not all giant screens. Sometimes <strong>the essence comes in a small bottle<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\" id=\"h-en-ocasiones-es-importante-que-el-profesor-monitor-supervisor-etc-tenga-acceso\">Sometimes it is important that the <strong>teacher, monitor, supervisor, etc.<\/strong> have the possibility to see <strong>permanently the level of CO\u2082<\/strong> in the environment.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In this image (<strong>bottom right<\/strong>) you can see how a small window <strong><em>\"floats\"<\/em> on the teacher's computer over and above what he or she is doing<\/strong>allowing you to view the CO\u2082 level at all times. The teacher can drag the window to <strong>relocate it, resize it<\/strong> and, of course, <strong>hide it<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelPIPanim.gif\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelPIPanim.gif\" alt=\"\" class=\"wp-image-237484\"\/><\/a><\/figure>\n\n<\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"h-limitaciones\">Limitations<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">As with everything else, this system also has its limitations.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">These are the ones I know of so far (if you discover another one let me know so I can include it).<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Low security: Not valid if you want to show \"sensitive\" data. It is intended for public data, so you don't care if someone, in whatever way, connects and gets it.<\/li><li>Concurrent users: The microcontroller used in the CO\u2082 meter (ESP8266) is not a real web server, so it won't support many connections at once. I have tested it with four simultaneous connections and it works, but I don't know how many it would support. This is intended for connecting a few display devices, not for a bunch of people connecting to the CO\u2082 meter directly.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-ejemplos-de-visualizaci-n\">Examples of visualisation<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">I will leave you here <strong>some examples of what I am doing<\/strong>to give you an idea:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1920\" src=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1.jpg\" alt=\"\" class=\"wp-image-237435\" srcset=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1.jpg 2560w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1-300x225.jpg 300w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1-1024x768.jpg 1024w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1-768x576.jpg 768w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1-1536x1152.jpg 1536w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/Tablet-Mariete-scaled-1-2048x1536.jpg 2048w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/a><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><a href=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1.jpeg\"><img loading=\"lazy\" decoding=\"async\" width=\"1839\" height=\"2560\" src=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1.jpeg\" alt=\"\" class=\"wp-image-237433\" srcset=\"https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1.jpeg 1839w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1-216x300.jpeg 216w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1-736x1024.jpeg 736w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1-768x1069.jpeg 768w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1-1103x1536.jpeg 1103w, https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/PanelMockup4-scaled-1-1471x2048.jpeg 1471w\" sizes=\"auto, (max-width: 1839px) 100vw, 1839px\" \/><\/a><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-tablets-recomendadas\">Recommended Tablets<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Almost any tablet should do<\/strong> as a display device. Of course, there are so many models that it is difficult to know a priori whether any of them will not work for some reason.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Most importantly, when used as a display device is <strong>the tablet is capable of being on and charging simultaneously<\/strong>. Almost all of them do, but not all, I, for example, have one that, <strong>even if it is plugged in<\/strong>The battery consumes more than it charges, so after a few hours it shuts down.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I recommend that you buy your tablet from Amazon, where you will be able to <strong>return it and exchange it for another one if it does not work, <\/strong>without any problem.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Here are some of Amazon's best-selling tablets:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><p >No products found.<\/p><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>If you use any tablet sold on Amazon (whether it is included in this list or not) let me know, with the results obtained, so that I can advise users.<\/strong><\/p>","protected":false},"excerpt":{"rendered":"<p>Easily turn a tablet, or SmartTV into a display device<\/p>","protected":false},"author":1,"featured_media":237443,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","_lmt_disableupdate":"yes","_lmt_disable":"no","footnotes":""},"categories":[12,16],"tags":[26],"class_list":["post-237335","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-co2-easy","category-medidor-co2","tag-espeasy"],"modified_by":"Mariete","uagb_featured_image_src":{"full":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares.png",1080,608,false],"thumbnail":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares-150x150.png",150,150,true],"medium":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares-300x169.png",300,169,true],"medium_large":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares-768x432.png",768,432,true],"large":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares-1024x576.png",1024,576,true],"1536x1536":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares.png",1080,608,false],"2048x2048":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares.png",1080,608,false],"trp-custom-language-flag":["https:\/\/emariete.com\/wp-content\/uploads\/2021\/01\/El-CO2-en-pantalla-gigante-para-bares-restaurantes-aulas-y-similares.png",18,10,false]},"uagb_author_info":{"display_name":"Mariete","author_link":"https:\/\/emariete.com\/en\/author\/admin_xlyz052h\/"},"uagb_comment_info":6,"uagb_excerpt":"Convierte f\u00e1cilmente una tablet, o un SmartTV en un dispositivo de visualizaci\u00f3n","_links":{"self":[{"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/posts\/237335","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/comments?post=237335"}],"version-history":[{"count":3,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/posts\/237335\/revisions"}],"predecessor-version":[{"id":241537,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/posts\/237335\/revisions\/241537"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/media\/237443"}],"wp:attachment":[{"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/media?parent=237335"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/categories?post=237335"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/emariete.com\/en\/wp-json\/wp\/v2\/tags?post=237335"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}