Layer 1

{"type":"doc","content":[{"type":"extension","attrs":{"layout":"default","extensionType":"com.atlassian.confluence.macro.core","extensionKey":"toc","parameters":{"macroParams":{"_parentId":{"value":"2216829621"}},"macroMetadata":{"macroId":{"value":"2ecb4927-d35e-4e68-ab78-d6b55c0daedc"},"schemaVersion":{"value":"1"},"title":"Table of Contents"}},"localId":"a9ab26d6-541d-4a46-9a8b-55684fd4c719"}},{"type":"heading","attrs":{"level":1},"content":[{"text":"Introducción","type":"text"}]},{"type":"paragraph","content":[{"text":"El acrónimo SCADA viene del inglés “Supervisory Control And Data Acquisition” (Supervisión, Control y Adquisición de Datos). Es un concepto que se emplea para realizar un software que permite controlar y supervisar procesos industriales a distancia.","type":"text"}]},{"type":"paragraph","content":[{"text":"Se ha incluido la funcionalidad para poder crear sinópticos sobre el motor de dashboard.","type":"text"}]},{"type":"paragraph","content":[{"text":"Con esto se consigue que podamos definir sinópticos y utilizar toda la potencia actual que nos proveen los gadgets que hasta ahora usábamos en el desarrollo de dashboads.","type":"text"}]},{"type":"heading","attrs":{"level":1},"content":[{"text":"Creación de un Sinóptico","type":"text"}]},{"type":"paragraph","content":[{"text":"Crearemos un sinóptico de ejemplo, donde se muestra parte de un proceso industrial con dos depósitos:","type":"text"}]},{"type":"paragraph","content":[{"text":"Para lo cual tendremos que realizar varios pasos en la plataforma. Crearemos:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Una ontología,","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Un datasource,","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Un cliente digital,","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Una simulación del cliente digital y","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Un sinóptico.","type":"text"}]}]}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Creación de la Ontología","type":"text"}]},{"type":"paragraph","content":[{"text":"Para este ejemplo nos basta con una ontología, que contendrá la información que se irá recogiendo del cliente digital y posteriormente se mostrará en el sinóptico.","type":"text"}]},{"type":"paragraph","content":[{"text":"Seleccionaremos en el menú:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":6607,"__fileMimeType":"image/png","width":331,"id":"643798ee-99a4-4f85-93d6-877089a7994c","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_12-57-24.png","height":142}}]},{"type":"paragraph","content":[{"text":"Pulsamos el botón CREATE ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"d73d5925-d895-45d4-94b7-268de7803605","collection":"contentId-2216829621","height":""}}}]},{"type":"paragraph","content":[{"text":"Luego para la creación de la ontología utilizaremos la opción que más nos convenga.","type":"text"}]},{"type":"paragraph","content":[{"text":"Para el ejemplo hemos creado la ontología “deposits”.","type":"text"}]},{"type":"paragraph","content":[{"text":"Éste es su esquema:","type":"text"}]},{"type":"codeBlock","attrs":{"language":"plaintext"},"content":[{"text":"{\n \"$schema\": \"http://json-schema.org/draft-07/schema#\",\n \"title\": \"deposits\",\n \"type\": \"object\",\n \"required\": [\n \"deposits\"\n ],\n \"properties\": {\n \"deposits\": {\n \"type\": \"string\",\n \"$ref\": \"#/datos\"\n }\n },\n \"datos\": {\n \"description\": \"Properties for DataModel deposits\",\n \"type\": \"object\",\n \"properties\": {\n \"flow\": {\n \"type\": \"number\"\n },\n \"level1\": {\n \"type\": \"number\"\n },\n \"level2\": {\n \"type\": \"number\"\n },\n \"temp1\": {\n \"type\": \"number\"\n },\n \"temp2\": {\n \"type\": \"number\"\n }\n }\n },\n \"description\": \"deposits\",\n \"additionalProperties\": true\n}\n\n","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Creación del DataSource","type":"text"}]},{"type":"paragraph","content":[{"text":"El siguiente paso será definir un datasource para nuestra ontología.","type":"text"}]},{"type":"paragraph","content":[{"text":"Para lo cual seleccionamos en el menú","type":"text"}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"f332f062-96e0-4ec6-8e78-8d48fa962c44","collection":"contentId-2216829621","height":""}}},{"text":"Y pulsamos CREATE","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":3529,"__fileMimeType":"image/png","width":239,"id":"e9f37fa0-a5ee-4555-8223-6731e0f04b9c","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-0-28.png","height":64}}]},{"type":"paragraph","content":[{"text":"Rellenamos la información del datasource de la siguiente forma para obtener los datos de la ontología como más nos conviene.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":18816,"__fileMimeType":"image/png","width":567,"id":"9c47c334-d975-4140-b43c-787c0c28c347","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-0-45.png","height":139}}]},{"type":"paragraph","content":[{"text":"Como se ve en la imagen hay que tener en cuenta limitar los valores a 1, poner un tiempo de refresco bajo para que los datos se refresquen más frecuentemente, y al final de la query añadir “order by contextData.timestampMillis desc“, para que nos muestre siempre el último dato insertado en la ontología.","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Creación del Digital Client","type":"text"}]},{"type":"paragraph","content":[{"text":"A continuación, creamos un cliente digital.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":5252,"__fileMimeType":"image/png","width":312,"id":"045f47b4-7be0-40ab-a5ed-c20128783691","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-1-16.png","height":121}}]},{"type":"paragraph","content":[{"text":"Pulsamos el botón CREATE y rellenamos el formulario añadiendo la ontología que hemos creado inicialmente al listado de ontologías, dándole como acceso ALL.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":18703,"__fileMimeType":"image/png","width":567,"id":"45d0f2d1-7af3-410b-a0e5-6b7a9073d5fd","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-1-37.png","height":195}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Creación del Simulador","type":"text"}]},{"type":"paragraph","content":[{"text":"El siguiente paso es crear un simulador para el cliente digital. Este paso, aunque opcional, es conveniente puesto que nos permite simular la entrada de datos desde el cliente a la ontología, que luego visualizaremos en el sinóptico. Posteriormente podemos detener la simulación cuando el cliente obtenga datos reales.","type":"text"}]},{"type":"paragraph","content":[{"text":"En el menú pulsamos:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":9660,"__fileMimeType":"image/png","width":313,"id":"b4108cce-7d64-45e9-a0dd-0bfb7b01848c","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-1-58.png","height":182}}]},{"type":"paragraph","content":[{"text":"Y luego el botón CREATE.","type":"text"}]},{"type":"paragraph","content":[{"text":"Rellenamos el formulario seleccionando el cliente digital y la ontología creado previamente.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":8771,"__fileMimeType":"image/png","width":567,"id":"8923ebe4-d6b7-47e1-8c0b-c1b16cb90616","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-2-39.png","height":71}}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":2481,"__fileMimeType":"image/png","width":391,"id":"c60943a0-7392-4aa9-b7d9-2df34faba0a2","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-2-46.png","height":87}}]},{"type":"paragraph","content":[{"text":"Luego para cada property, se define como queremos que se generen los datos para nuestro ejemplo:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":21.0},"content":[{"type":"media","attrs":{"__fileSize":8547,"__fileMimeType":"image/png","width":509,"id":"8fe1c66e-eb04-41ad-bb97-35f01f0a7a25","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-3-4.png","height":262}}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":20.0},"content":[{"type":"media","attrs":{"__fileSize":24842,"__fileMimeType":"image/png","width":512,"id":"fc97d20e-6d5a-48ec-af3a-2c82e30859ca","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-3-11.png","height":769}}]},{"type":"mediaSingle","attrs":{"layout":"align-start","width":21.0},"content":[{"type":"media","attrs":{"__fileSize":8343,"__fileMimeType":"image/png","width":495,"id":"64cd79bc-cdbc-4e05-a9b2-ac37f9b7f0c3","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-3-25.png","height":255}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Creación del Sinóptico","type":"text"}]},{"type":"paragraph","content":[{"text":"Con todos los elementos previos creados, vamos a crear nuestro primer sinóptico:","type":"text"}]},{"type":"paragraph","content":[{"text":"Pulsamos en el menú:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":5313,"__fileMimeType":"image/png","width":315,"id":"ab872e14-ab93-4bd9-a678-48cd9fa52d8a","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-3-53.png","height":107}}]},{"type":"paragraph","content":[{"text":"Pulsamos el botón:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":2762,"__fileMimeType":"image/png","width":165,"id":"dfbf80d5-f96e-4402-8134-43e32ae71a3b","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-4-9.png","height":78}}]},{"type":"paragraph","content":[{"text":"Rellenamos el formulario, con una identificación y una descripción nos basta pulsamos new.","type":"text"}]},{"type":"paragraph","content":[{"text":"Se abre la pantalla con el editor de sinópticos. Es similar a la de edición de dashboards aunque tiene nuevos elementos :","type":"text"}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"2facdc10-a33e-46b2-bb97-43290fb788b0","collection":"contentId-2216829621","height":"250"}}},{"text":"Estos elementos son :","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Botón guardar sinóptico","type":"text","marks":[{"type":"strong"}]},{"text":", hace un guardado temporal del sinóptico. Si no guardamos el dashboad antes de salir, se perderán los cambios, en versiones posterior a la 1.5.0 no existe este botón.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":2823,"__fileMimeType":"image/png","width":124,"id":"cb3e0a1c-aa66-490d-b416-8a9a83ac6dcd","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-4-58.png","height":92}}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Oculta","type":"text","marks":[{"type":"strong"}]},{"text":" ","type":"text"},{"text":"el editor del sinóptico","type":"text","marks":[{"type":"strong"}]},{"text":", si no hemos guardado el sinóptico se perderán los cambios que se hagan sobre él.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":755,"__fileMimeType":"image/png","width":35,"id":"fe129c8c-13d5-45a2-b279-e6341e858434","collection":"contentId-2216829621","type":"file","__fileName":"image2020-4-13_13-22-58.png","height":44}}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Menú sidenav derecho,","type":"text","marks":[{"type":"strong"}]},{"text":" contiene todas las herramientas pintar y dar funcionalidad al sinóptico. Podemos clicar sobre él o arrastrarlo, para mostrar u ocultarlo.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":1964,"__fileMimeType":"image/png","width":71,"id":"655f0e71-20e0-4f26-b106-54418ce5128d","collection":"contentId-2216829621","type":"file","__fileName":"image2020-4-13_13-23-16.png","height":131}}]},{"type":"paragraph","content":[{"text":"Si lo desplegamos, tiene cuatro secciones.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"DRAW:","type":"text","marks":[{"type":"strong"}]},{"text":" son las herramientas de dibujo que nos permiten añadir nuevos elementos como imágenes pre diseñadas, cuadrados, rectángulos, círculos, líneas…","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":8.0},"content":[{"type":"media","attrs":{"__fileSize":47231,"__fileMimeType":"image/png","width":277,"id":"41871000-5104-4111-ac00-790c9f69e735","collection":"contentId-2216829621","type":"file","__fileName":"image2020-4-13_13-24-54.png","height":547}}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"ELEMENTS","type":"text","marks":[{"type":"strong"}]},{"text":": muestra las propiedades del dibujo que podemos modificar para los elementos que tengamos seleccionados, por ejemplo de un rectángulo.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":31.0},"content":[{"type":"media","attrs":{"__fileSize":43934,"__fileMimeType":"image/png","width":901,"id":"a3aaf430-968b-4305-bb4f-31af96db2daa","collection":"contentId-2216829621","type":"file","__fileName":"image2020-4-13_13-25-29.png","height":548}}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"PROPERTIES","type":"text","marks":[{"type":"strong"}]},{"text":": En esta sección damos funcionalidad a los distintos elementos seleccionándolos. Inicialmente hay tres tipos de componentes:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Indicator","type":"text","marks":[{"type":"strong"}]},{"text":": Es un elemento del sinóptico que cambia de color en función de un valor de corte que asígnemos.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Progress bar","type":"text","marks":[{"type":"strong"}]},{"text":": Se puede asignar a elementos del tipo cuadrado o rectángulo. Como el indicador, puede cambiar de color en función de un valor de corte. Además crece porcentual mente en función del valor que se asigne y los limites superior e inferior que le indiquemos","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Label","type":"text","marks":[{"type":"strong"}]},{"text":": Si creamos un elemento tipo texto y le asignamos esta clase, podemos hacer como con los dos componentes anteriores y cambiar su color en función del valor de corte, y podemos definir un parámetro del datasource para mostrar su valor.","type":"text"}]}]}]}]}]},{"type":"paragraph","content":[{"text":"A estos componentes podemos asignarles cualquiera de los datasources que tengamos disponibles y cualquiera de sus atributos.","type":"text"}]},{"type":"paragraph","content":[{"text":"En el apartado ","type":"text"},{"text":"TOOLS","type":"text","marks":[{"type":"strong"}]},{"text":":","type":"text"}]},{"type":"paragraph","content":[{"text":"Tenemos un menú desplegable para tratar ficheros y las capas del dibujo.","type":"text"}]},{"type":"paragraph","content":[{"text":"Tras esta breve descripción del editor continuamos con el ejemplo:","type":"text"}]},{"type":"paragraph","content":[{"text":"Creamos las imágenes del sinóptico en formato svg. Para esto podemos utilizar el editor o cualquier aplicación de escritorio o web que genere imágenes vectoriales, ya que las podemos importar de múltiples maneras. Una de ellas es pulsando en el botón ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"e7583464-ecc9-44cd-94c2-52a7076a7aa0","collection":"contentId-2216829621","height":""}}}]},{"type":"paragraph","content":[{"text":"Nos aparece una ventana modal con el código de nuestra imagen. Al principio aparece como una imagen svg vacía. Si ya tenemos una imagen, podemos pegar el código svg aquí y pulsar OK.","type":"text"}]},{"type":"codeBlock","content":[{"text":"","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"__fileSize":45295,"__fileMimeType":"image/png","width":567,"id":"b5f1ca65-2065-4948-b95c-4e67fe92fbed","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-7-56.png","height":182}}]},{"type":"paragraph","content":[{"text":"Al cerrar la modal, veremos nuestra imagen:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":83.0},"content":[{"type":"media","attrs":{"__fileSize":57868,"__fileMimeType":"image/png","width":567,"id":"cc0c1c69-e4c2-4a58-8b4f-e4982af21637","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-10-50.png","height":396}}]},{"type":"paragraph","content":[{"text":"En nuestro ejemplo añadiremos dos progress bars, una para el ","type":"text"},{"text":"pumping well","type":"text","marks":[{"type":"em"}]},{"text":" y otra para el ","type":"text"},{"text":"refrigerated water tank.","type":"text","marks":[{"type":"em"}]}]},{"type":"paragraph","content":[{"text":"También añadiremos labels para el flow, temp level …","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Crear un progress bar.","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"Clicamos sobre el botón ","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"659bfc33-2120-4ab4-8ef2-26cda186ae81","collection":"contentId-2216829621","height":""}}},{"text":" . Entonces pintamos la figura dentro del pumping well, con la orientación que se indica para que crezca hacia arriba.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":35.0},"content":[{"type":"media","attrs":{"__fileSize":16850,"__fileMimeType":"image/png","width":479,"id":"e83bfc48-490d-4dcf-b117-4d3564c0a80a","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-12-54.png","height":267}}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Luego en PROPERTIES lo rellenamos de la siguiente manera:","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Asignamos la clase progress_bar, seleccionamos el datasource y en progressBar Attributes seleccionamos el parámetro deposits.level1 y asignamos un min y un max y el tipo de crecimiento vertical para que crezca hacia arriba.","type":"text"}]}]}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":10.0},"content":[{"type":"media","attrs":{"__fileSize":18256,"__fileMimeType":"image/png","width":256,"id":"c0740d5c-210c-46d0-bb52-60af8fb92ab1","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-14-58.png","height":458}}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Crear un label:","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"Pulsamos el botón","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"inline-media-image","parameters":{"width":"","id":"e00d5a94-f8b7-4c70-bcec-65654b48e122","collection":"contentId-2216829621","height":""}}},{"text":" ","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Escribimos por ejemplo *** para que se vea como valor inicial.","type":"text"}]}]},{"type":"listItem","content":[{"type":"mediaSingle","attrs":{"layout":"align-start"},"content":[{"type":"media","attrs":{"__fileSize":1404,"__fileMimeType":"image/png","width":179,"id":"a833fa47-342d-4dc4-9518-80021f34b0d7","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-13-45.png","height":63}}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Luego vamos al apartado PROPERTIES.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Marcamos la clase label.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Seleccionamos el datasource un color attributes y un textAttributes que será el valor que se muestre.","type":"text"}]}]}]},{"type":"mediaSingle","attrs":{"layout":"center","width":12.0},"content":[{"type":"media","attrs":{"__fileSize":16023,"__fileMimeType":"image/png","width":263,"id":"dfeb20f1-3fb0-4fc7-9239-dbb6bfb5c896","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-14-10.png","height":384}}]},{"type":"paragraph","content":[{"text":"Aplicamos esto para cada elemento label o progressbar.","type":"text"}]},{"type":"paragraph","content":[{"text":"Guardamos el sinóptico y pulsamos sobre hide editor. Pulsamos en guardar dashboard para no perder los cambios si salimos del dashboard.","type":"text"}]},{"type":"paragraph","content":[{"text":"Tras pulsar en hide editor ya vemos cómo se van cargando los valores en nuestro sinóptico.","type":"text"}]},{"type":"paragraph","content":[{"text":"Además, hemos creado un par de gadgets que muestran en tiempo real las últimas 50 temperaturas y niveles registrados.","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center","width":100.0},"content":[{"type":"media","attrs":{"__fileSize":78539,"__fileMimeType":"image/png","width":567,"id":"03f147ca-47ae-47a5-9d94-db6756147eff","collection":"contentId-2216829621","type":"file","__fileName":"image2019-7-2_13-14-34.png","height":301}}]},{"type":"paragraph","content":[{"type":"hardBreak"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]},{"type":"paragraph","content":[{"type":"hardBreak"}]}],"version":1}

Browser not supported