Add map display to show overlaps #409

This commit is contained in:
Kendrick Chan 2020-05-24 16:09:17 +08:00
parent 06d3aa3b27
commit 8be67413d4
2 changed files with 37 additions and 3 deletions

View file

@ -61,27 +61,38 @@ class AnalyticsController extends Controller
// $hub_list = [ 6, 4, 36, 7, 8, 126, 127, 18, 12, 9, 60, 10, 21, 135 ];
$hub_data = [];
$hub_coverage = [];
foreach ($hub_list as $key => $hub_id)
{
$hub = $em->getRepository(Hub::class)->find($hub_id);
$coords = $hub->getCoordinates();
$dist = $distances[$key];
$hub_data[$hub_id] = $this->generateHubData($em, $hub_id, $dist, $today);
$hub_data[$hub_id] = $this->generateHubData($em, $hub, $dist, $today);
$hub_coverage[] = [
'longitude' => $coords->getLongitude(),
'latitude' => $coords->getLatitude(),
'distance' => $dist,
];
}
$params = [
'date' => $today,
'hub_list' => $hub_data,
'hub_coverage' => $hub_coverage,
];
return $this->render('analytics/forecast_submit.html.twig', $params);
}
protected function generateHubData($em, $hub_id, $distance_limit, DateTime $today)
protected function generateHubData($em, $hub, $distance_limit, DateTime $today)
{
$date_start = DateTime::createFromFormat('Y-m-d H:i:s', '2018-01-01 00:00:00');
$date_end = new DateTime();
// get hub to analyze
$hub = $em->getRepository(Hub::class)->find($hub_id);
// $hub = $em->getRepository(Hub::class)->find($hub_id);
$conn = $em->getConnection();
// get job order data

View file

@ -1,5 +1,9 @@
{% extends 'base.html.twig' %}
{% block stylesheets %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/>
{% endblock %}
{% block body %}
<!-- BEGIN: Subheader -->
<div class="m-subheader">
@ -12,6 +16,9 @@
<!-- END: Subheader -->
<div class="m-content">
<!--Begin::Section-->
<div id="map_coverage" style="height:600px; margin-bottom: 15px;">
</div>
{% for hub in hub_list %}
<div class="row">
<div class="col-xl-12">
@ -42,8 +49,24 @@
<script src="//www.amcharts.com/lib/4/core.js"></script>
<script src="//www.amcharts.com/lib/4/charts.js"></script>
<script src="//www.amcharts.com/lib/4/maps.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.js"></script>
<script>
// map
var map = L.map('map_coverage').setView([{% trans %}default_lat{% endtrans %}, {% trans %}default_long{% endtrans %}], 13);
L.tileLayer('https://api.maptiler.com/maps/streets/{z}/{x}/{y}.png?key={{ maptiler_api_key }}',{
tileSize: 512,
zoomOffset: -1,
minZoom: 1,
crossOrigin: true
}).addTo(map);
{% for cover in hub_coverage %}
L.circle([{{ cover.latitude }}, {{ cover.longitude }}], { radius: {{ cover.distance }} }).addTo(map);
{% endfor %}
{% for hub in hub_list %}
// create chart instance
var chart = am4core.create("year-day-chart-{{ hub.id }}", am4charts.XYChart);