124 lines
3.7 KiB
PHP
124 lines
3.7 KiB
PHP
@extends('base')
|
|
@section('main')
|
|
<article class="header">
|
|
<header>
|
|
<h2>
|
|
Properties pro Region
|
|
</h2>
|
|
</header>
|
|
<div id="chart-props-per-region"></div>
|
|
</article>
|
|
<article class="header">
|
|
<header>
|
|
<h2>
|
|
Anzahl Properties p. Extractions
|
|
</h2>
|
|
</header>
|
|
<div id="extractions"></div>
|
|
</article>
|
|
<article class="header">
|
|
<header>
|
|
<h2>
|
|
Anzahl Properties p. Extractions
|
|
</h2>
|
|
</header>
|
|
<div id="capacity"></div>
|
|
</article>
|
|
<article>
|
|
<div id="leaflet"></div>
|
|
</article>
|
|
|
|
<script type="module">
|
|
const chartPropsPerRegion = document.getElementById('chart-props-per-region');
|
|
const cPropsPerRegion = echarts.init(chartPropsPerRegion);
|
|
const cPropsPerRegionOptions = {
|
|
grid: {
|
|
top: 20,
|
|
left: 30,
|
|
right: 0,
|
|
bottom: 20
|
|
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
data: {!! $propsPerRegion[0] !!}
|
|
},
|
|
yAxis: {
|
|
type: 'value'
|
|
},
|
|
series: [
|
|
{
|
|
data: {!! $propsPerRegion[1] !!},
|
|
type: 'bar'
|
|
}
|
|
]
|
|
};
|
|
|
|
cPropsPerRegion.setOption(cPropsPerRegionOptions);
|
|
|
|
const chartExtractions = document.getElementById('extractions');
|
|
const cExtractions = echarts.init(chartExtractions);
|
|
|
|
const filters = {
|
|
regions: ["Davos", "Engadin", "Heidiland", "St. Moritz"]
|
|
}
|
|
|
|
const cExtractionsOptions = {
|
|
tooltip: {
|
|
trigger: 'axis'
|
|
},
|
|
legend: {
|
|
data: filters.regions
|
|
},
|
|
grid: {
|
|
left: '0',
|
|
right: 10,
|
|
bottom: '0',
|
|
containLabel: true
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
boundaryGap: false,
|
|
data: ['2024-04-14','2024-04-15','2024-04-16','2024-04-19','2024-04-22','2024-04-25','2024-04-28','2024-05-01','2024-05-04','2024-05-07','2024-05-10','2024-05-13','2024-05-16','2024-05-19','2024-05-22','2024-05-25','2024-05-28','2024-05-31','2024-06-01','2024-06-04','2024-06-07','2024-06-10','2024-06-13','2024-06-16','2024-06-19','2024-06-22','2024-06-25','2024-06-28','2024-07-01','2024-07-04','2024-07-07','2024-07-10','2024-07-13','2024-07-16','2024-07-19','2024-07-22','2024-07-25','2024-07-28','2024-07-31','2024-08-01','2024-08-04','2024-08-07','2024-08-10','2024-08-13','2024-08-16','2024-08-19','2024-08-22']
|
|
},
|
|
yAxis: {
|
|
type: 'value'
|
|
},
|
|
series: [
|
|
{
|
|
name: 'Alle',
|
|
type: 'line',
|
|
stack: 'Total',
|
|
data: [596, 239, 835, 673, 863, 1803, 904, 915, 958, 966, 1001, 1031, 1044, 1055, 1158, 1162, 1181, 1203, 1207, 1214, 1254, 1258, 1264, 1288, 1296, 1305, 1318, 1323, 1330, 1333, 1342, 1350, 1436, 1454, 1461, 1469, 1492, 1504, 1506, 1510, 1512, 1518, 1534, 1535, 1541, 1544, 1500]
|
|
},
|
|
{
|
|
name: 'Heidiland',
|
|
type: 'line',
|
|
stack: 'Heidiland',
|
|
data: [133,64,197,151,197,417,210,213,215,220,226,239,247,251,251,252,262,275,276,277,281,283,284,286,287,287,287,287,287,287,287,289,290,292,293,294,294,294,295,295,295,296,312,313,313,313,301]
|
|
},
|
|
{
|
|
name: 'Davos',
|
|
type: 'line',
|
|
stack: 'Davos',
|
|
data: [133,56,189,152,196,409,206,209,209,209,221,223,223,224,226,227,230,234,236,238,250,252,252,259,261,263,267,270,272,272,274,274,277,278,279,281,286,289,289,289,289,290,290,290,293,296,285]
|
|
},
|
|
{
|
|
name: 'Engadin',
|
|
type: 'line',
|
|
stack: 'Engadin',
|
|
data: [185,73,258,212,278,569,284,289,326,326,340,346,350,355,413,413,413,413,414,415,438,438,442,455,460,463,470,472,477,479,484,486,544,554,558,561,578,585,586,590,592,595,595,595,597,597,583]
|
|
},
|
|
{
|
|
name: 'St. Moritz',
|
|
type: 'line',
|
|
stack: 'St. Moritz',
|
|
data: [145,46,191,158,192,408,204,204,208,211,214,223,224,225,268,270,276,281,281,284,285,285,286,288,288,292,294,294,294,295,297,301,325,330,331,333,334,336,336,336,336,337,337,337,338,338,331]
|
|
},
|
|
]
|
|
};
|
|
|
|
cExtractions.setOption(cExtractionsOptions);
|
|
</script>
|
|
@endsection
|