Query and display city field chart and all city weather data
This commit is contained in:
Guntis Smaukstelis
@@ -45,22 +45,25 @@ object Main {
|
||||
// } yield re
|
||||
|
||||
val formatter = DateTimeFormatter.ofPattern("yyyyMMdd_HHmm")
|
||||
val from = LocalDateTime.parse("20231210_0000", formatter)
|
||||
val to = LocalDateTime.parse("20231214_2359", formatter)
|
||||
val cities = NonEmptyList.of("Ainaži", "Rīga", "Kolka", "Vičaki")
|
||||
val from = LocalDateTime.parse("20240110_1000", formatter)
|
||||
val to = LocalDateTime.parse("20240111_1000", formatter)
|
||||
// val cities = NonEmptyList.of("Ainaži", "Rīga", "Kolka", "Vičaki")
|
||||
// val cities = NonEmptyList.of("Rīga")
|
||||
|
||||
val query = UserQuery(cities, "tempMax", AggregateKey.List, ChronoUnit.DAYS, from, to)
|
||||
// val query = UserQuery(cities, "tempMax", AggregateKey.List, ChronoUnit.DAYS, from, to)
|
||||
|
||||
val re = for {
|
||||
postgresService <- PostgresService.of(xa)
|
||||
re <- postgresService.query(query)
|
||||
re <- postgresService.queryCityAllFields("Rīga", from, to)
|
||||
} yield re
|
||||
|
||||
val jssson = re.map(result => ResponseWrapper(result, query))
|
||||
.map(responseWrapper => responseWrapper.asJson.pretty)
|
||||
// val jssson = re.map(result => ResponseWrapper(result, query))
|
||||
// .map(responseWrapper => responseWrapper.asJson.pretty)
|
||||
|
||||
println(jssson.unsafeRunSync())
|
||||
println(re.unsafeRunSync())
|
||||
|
||||
|
||||
// println(jssson.unsafeRunSync())
|
||||
|
||||
// val result = createWeatherTable(xa).unsafeRunSync()
|
||||
// val result = insertInWeatherTable(xa).unsafeRunSync()
|
||||
|
||||
@@ -71,6 +71,35 @@ class PostgresService(transactor: Transactor[IO], log: Logger[IO]) {
|
||||
}.map(_.toMap)
|
||||
}
|
||||
|
||||
def queryCityAllFields(city: String, from: LocalDateTime, to: LocalDateTime): IO[Map[String, Option[Double]]] = {
|
||||
val query =
|
||||
fr"SELECT MAX(tempMax), MIN(tempMin), AVG(tempAvg), SUM(precipitation), AVG(windAvg), MAX(windMax), MIN(visibilityMin), AVG(visibilityAvg), AVG(snowAvg), AVG(atmPressure), AVG(dewPoint), AVG(humidity), SUM(sunDuration)" ++
|
||||
fr" FROM weather" ++
|
||||
fr" WHERE city = $city" ++
|
||||
fr" AND dateTime BETWEEN $from AND $to"
|
||||
|
||||
query.query[(Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double], Option[Double])]
|
||||
.unique
|
||||
.map { case (tempMax, tempMin, tempAvg, precipitation, windAvg, windMax, visibilityMin, visibilityAvg, snowAvg, atmPressure, dewPoint, humidity, sunDuration) =>
|
||||
Map(
|
||||
"tempMax" -> tempMax,
|
||||
"tempMin" -> tempMin,
|
||||
"tempAvg" -> tempAvg,
|
||||
"precipitation" -> precipitation,
|
||||
"windAvg" -> windAvg,
|
||||
"windMax" -> windMax,
|
||||
"visibilityMin" -> visibilityMin,
|
||||
"visibilityAvg" -> visibilityAvg,
|
||||
"snowAvg" -> snowAvg,
|
||||
"atmPressure" -> atmPressure,
|
||||
"dewPoint" -> dewPoint,
|
||||
"humidity" -> humidity,
|
||||
"sunDuration" -> sunDuration
|
||||
)
|
||||
}
|
||||
.transact(transactor)
|
||||
}
|
||||
|
||||
def query(userQuery: UserQuery): IO[Map[String, Option[AggregateValue]]] = {
|
||||
if (userQuery.field == "phenomena") { // this handles strings
|
||||
// TODO query list and distinct values from phenomena
|
||||
|
||||
@@ -58,6 +58,10 @@ class Server(postgresService: PostgresService, fetch: FetchService, log: Logger[
|
||||
.map(result => ResponseWrapper(result, userQuery))
|
||||
.flatMap(responseWrapper => Ok(responseWrapper.asJson.pretty))
|
||||
|
||||
// http://0.0.0.0:8080/api/query/city/Kolka/20230414_2200-20230501_1230/allFields
|
||||
case GET -> Root / "query" / "city" / (city: String) / DateTimeRange(from, to) / "allFields" =>
|
||||
postgresService.queryCityAllFields(city, from, to).flatMap(result => Ok(result.asJson))
|
||||
|
||||
// http://0.0.0.0:8080/api/query/country/20230414_2200-20230501_1230/tempMax,tempMin,tempAvg,precipitation
|
||||
case GET -> Root / "query" / "country" / DateTimeRange(from, to) / AggFieldList(fieldList) =>
|
||||
postgresService.queryCountry(from, to, fieldList)
|
||||
|
||||
@@ -6,15 +6,15 @@ import { CityLargeChart } from "./CityLargeChart";
|
||||
import { createCustomChart } from "./CustomChart";
|
||||
|
||||
export const CityChart: Component<{
|
||||
city: string;
|
||||
data: [string, number | null][];
|
||||
query: DataQuery;
|
||||
city: () => string;
|
||||
data: () => [string, number | null][];
|
||||
query: () => DataQuery;
|
||||
}> = (props) => {
|
||||
const [getCanvas, setCanvas] = createSignal<HTMLCanvasElement>();
|
||||
const [getIsLarge, setIsLarge] = createSignal(false);
|
||||
|
||||
let chart: Chart | undefined;
|
||||
const data: [string, number | null][] = props.data.map(([dateStr, value]) => [
|
||||
const data: [string, number | null][] = props.data().map(([dateStr, value]) => [
|
||||
formatDateString(dateStr),
|
||||
value,
|
||||
]);
|
||||
@@ -30,9 +30,9 @@ export const CityChart: Component<{
|
||||
false,
|
||||
timestamps,
|
||||
values,
|
||||
props.city,
|
||||
props.query.field,
|
||||
props.query.granularity,
|
||||
props.city(),
|
||||
props.query().field,
|
||||
props.query().granularity,
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
@@ -6,14 +6,14 @@ import "../../css/overlay.css"
|
||||
import { createCustomChart } from "./CustomChart";
|
||||
|
||||
export const CityLargeChart: Component<{
|
||||
city: string;
|
||||
data: [string, number | null][];
|
||||
query: DataQuery;
|
||||
city: () => string;
|
||||
data: () => [string, number | null][];
|
||||
query: () => DataQuery;
|
||||
close: () => void
|
||||
}> = (props) => {
|
||||
const [getCanvas, setCanvas] = createSignal<HTMLCanvasElement>();
|
||||
let chart: Chart;
|
||||
const data: [string, number | null][] = props.data.map(([dateStr, value]) => [
|
||||
const data: [string, number | null][] = props.data().map(([dateStr, value]) => [
|
||||
formatDateString(dateStr),
|
||||
value,
|
||||
]);
|
||||
@@ -30,9 +30,9 @@ export const CityLargeChart: Component<{
|
||||
true,
|
||||
timestamps,
|
||||
values,
|
||||
props.city,
|
||||
props.query.field,
|
||||
props.query.granularity,
|
||||
props.city(),
|
||||
props.query().field,
|
||||
props.query().granularity,
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
@@ -1,9 +1,88 @@
|
||||
import { Accessor, Component } from "solid-js";
|
||||
import { Accessor, Component, createResource } from "solid-js";
|
||||
import { apiHost } from "../consts";
|
||||
import moment from "moment";
|
||||
import { CityChart } from "../cities/chart/CityChart";
|
||||
|
||||
export const Result: Component<{
|
||||
getCity: Accessor<string|undefined>,
|
||||
getField: Accessor<string>,
|
||||
getStart: Accessor<Date>,
|
||||
getEnd: Accessor<Date>,
|
||||
}> = (props) => {
|
||||
const queryStart = () => moment(props.getStart()).format("YYYYMMDD_HHmm");
|
||||
const queryEnd = () => moment(props.getEnd()).format("YYYYMMDD_HHmm");
|
||||
|
||||
const fetchList = async (city: string | undefined) => {
|
||||
if (city === undefined) return undefined;
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
const response = await fetch(`${apiHost}/api/query/city/${props.getCity()}/${queryStart()}-${queryEnd()}/hour/${props.getField()}/list`);
|
||||
const json = await response.json();
|
||||
return json;
|
||||
}
|
||||
|
||||
const fetchMeteo = async (city: string | undefined) => {
|
||||
if (city === undefined) return undefined;
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
const response = await fetch(`${apiHost}/api/query/city/${props.getCity()}/${queryStart()}-${queryEnd()}/allFields`);
|
||||
const json = await response.json();
|
||||
return json;
|
||||
}
|
||||
|
||||
const [listResource] = createResource(props.getCity, fetchList);
|
||||
const [meteoResource] = createResource(props.getCity, fetchMeteo);
|
||||
|
||||
export const Result: Component<{ getCity: Accessor<string|undefined>}> = ({ getCity }) => {
|
||||
return (
|
||||
<div>
|
||||
{ getCity() }
|
||||
{
|
||||
props.getCity() === undefined && <div>Select city!</div>
|
||||
}
|
||||
|
||||
{ /* City weather field as chart */}
|
||||
{ listResource.loading && (
|
||||
<div>
|
||||
<span class="spinner"></span>
|
||||
<span style={{ "padding-left": "16px" }}>Loading chart</span>
|
||||
</div>
|
||||
)}
|
||||
{ listResource.error && (
|
||||
<div>Error while querying: ${listResource.error}</div>
|
||||
)}
|
||||
{ listResource() && listResource() instanceof Error &&
|
||||
<div>{ listResource().message }</div>
|
||||
}
|
||||
{ listResource() && props.getCity() &&
|
||||
<div>
|
||||
<h3>{ props.getCity() }</h3>
|
||||
<CityChart
|
||||
city={() => listResource().query.cities[0]}
|
||||
data={() => listResource().result[listResource().query.cities[0]]}
|
||||
query={() => listResource().query}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
|
||||
{ /* City all weather fields with double values */}
|
||||
{ meteoResource.loading && (
|
||||
<div>
|
||||
<span class="spinner"></span>
|
||||
<span style={{ "padding-left": "16px" }}>Loading meteo data</span>
|
||||
</div>
|
||||
)}
|
||||
{ meteoResource.error && (
|
||||
<div>Error while querying: ${meteoResource.error}</div>
|
||||
)}
|
||||
{ meteoResource() && meteoResource() instanceof Error &&
|
||||
<div>{ meteoResource().message }</div>
|
||||
}
|
||||
{ meteoResource() && props.getCity() &&
|
||||
<ul>
|
||||
{ Object.entries(meteoResource())
|
||||
.sort((a, b) => a[0] > b[0] ? 1 : -1)
|
||||
.map(([key, value]: any) =>
|
||||
<li>{key}: {value}</li>
|
||||
)}
|
||||
</ul>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -17,7 +17,9 @@ export const Station: Component<{}> = () => {
|
||||
const [getCities, setCities] = createSignal<Set<string>>(new Set(["Ainaži", "Rīga", "Rēzekne", "Liepāja", "Daugavpils", "Ventspils", "Madona"]));
|
||||
const [getDate, setDate] = createSignal(moment());
|
||||
const [getField, setField] = createSignal("tempMax");
|
||||
const [getCity, setCity] = createSignal<string | undefined>(undefined);
|
||||
const [getCity, setCity] = createSignal<string | undefined>("Rīga");
|
||||
const [getStart, setStart] = createSignal(moment().subtract(1, "days").toDate());
|
||||
const [getEnd, setEnd] = createSignal(moment().toDate());
|
||||
|
||||
let ctx: CanvasRenderingContext2D | undefined;
|
||||
|
||||
@@ -71,7 +73,12 @@ export const Station: Component<{}> = () => {
|
||||
<canvas ref={setCanvas} width={1000} height={570} />
|
||||
</div>
|
||||
<div class="column">
|
||||
<Result getCity={getCity} />
|
||||
<Result
|
||||
getCity={getCity}
|
||||
getField={getField}
|
||||
getStart={getStart}
|
||||
getEnd={getEnd}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user