juliobguedes/Readme.md

## Readme.md

      
    Raw
  

              Readme.md
            
          
    Lab 1 - Visualização da Informação - UFCG

Júlio Barreto - 116110520

Visualização inicial sobre os dados do açude Epitácio Pessoa.
API com os dados, fornecido pelo Instituto Nacional do Semiárido: https://api.insa.gov.br/reservatorios/12172/monitoramento
Sobre os dados escolhidos:
Data ("DataInformacao"): A data pode ser usada para plotar um gráfico que represente, durante um eixo de tempo, algo sobre a informação.
Volume Percentual ("VolumePercentual"): O volume do açude pode ser usado para mapear, junto com o tempo, período de secas e cheias, além de auxiliar no controle de água.

  
## index.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vega/3.0.6/vega.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vega-lite/2.0.0-rc5/vega-lite.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vega-embed/3.0.0-rc6/vega-embed.js"></script>
  <style>
    body {
      font-family: sans-serif;
    }
  </style>
</head>

<body>
  <div id="vis"></div>

  <script>
    const spec = "tempoXvolume.json";
  	vegaEmbed('#vis', spec).catch(console.warn);
  </script>
</body>

## tempoXvolume.json
{
    "$schema": "https://vega.github.io/schema/vega-lite/v2.json",
    "data": {
        "url":"https://api.insa.gov.br/reservatorios/12172/monitoramento",
        "format": {
            "type": "json",
            "property": "volumes",
            "parse": {
                "DataInformacao": "utc:'%d/%m/%Y'"
            }
        }
    }, "mark":"line",
    "encoding": {
        "x":{
            "field":"DataInformacao",
            "type": "temporal",
            "timeUnit":"year"
        },
        "y":{
            "field":"Volume",
            "aggregate":"average",
            "type": "quantitative"
        }
    },
    "width": 800,
    "height": 500
}
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/vega/3.0.6/vega.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/vega-lite/2.0.0-rc5/vega-lite.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/vega-embed/3.0.0-rc6/vega-embed.js"></script>
	<style>
	body {
	font-family: sans-serif;
	}
	</style>
	</head>

	<body>
	<div id="vis"></div>

	<script>
	const spec = "tempoXvolume.json";
	vegaEmbed('#vis', spec).catch(console.warn);
	</script>
	</body>
	{
	"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
	"data": {
	"url":"https://api.insa.gov.br/reservatorios/12172/monitoramento",
	"format": {
	"type": "json",
	"property": "volumes",
	"parse": {
	"DataInformacao": "utc:'%d/%m/%Y'"
	}
	}
	}, "mark":"line",
	"encoding": {
	"x":{
	"field":"DataInformacao",
	"type": "temporal",
	"timeUnit":"year"
	},
	"y":{
	"field":"Volume",
	"aggregate":"average",
	"type": "quantitative"
	}
	},
	"width": 800,
	"height": 500
	}