mirror of
https://github.com/MobSF/Mobile-Security-Framework-MobSF.git
synced 2026-10-12 02:06:59 +00:00
Server locations Map (#1640)
Server Locations on World Map Chart Fixes a template bug in the File Analysis Section of Android Source
This commit is contained in:
Ajin Abraham
+8112
-4307
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1 @@
|
||||
am4internal_webpackJsonp(["ab45"],{lhmh:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=i("aCit"),a=function(t){Object(n.b)(t,"SpriteState")&&(t.transitionDuration=400),Object(n.b)(t,"Component")&&(t.rangeChangeDuration=500,t.interpolationDuration=500,t.sequencedInterpolation=!1,Object(n.b)(t,"SankeyDiagram")&&(t.sequencedInterpolation=!0),Object(n.b)(t,"FunnelSeries")&&(t.sequencedInterpolation=!0)),Object(n.b)(t,"Chart")&&(t.defaultState.transitionDuration=2e3,t.hiddenState.transitionDuration=1e3),Object(n.b)(t,"Tooltip")&&(t.animationDuration=400,t.defaultState.transitionDuration=400,t.hiddenState.transitionDuration=400),Object(n.b)(t,"Scrollbar")&&(t.animationDuration=500),Object(n.b)(t,"Series")&&(t.defaultState.transitionDuration=1e3,t.hiddenState.transitionDuration=700,t.hiddenState.properties.opacity=1,t.showOnInit=!0),Object(n.b)(t,"MapSeries")&&(t.hiddenState.properties.opacity=0),Object(n.b)(t,"PercentSeries")&&(t.hiddenState.properties.opacity=0),Object(n.b)(t,"FunnelSlice")&&(t.defaultState.transitionDuration=800,t.hiddenState.transitionDuration=1e3,t.hiddenState.properties.opacity=1),Object(n.b)(t,"Slice")&&(t.defaultState.transitionDuration=700,t.hiddenState.transitionDuration=1e3,t.hiddenState.properties.opacity=1),Object(n.b)(t,"Preloader")&&(t.hiddenState.transitionDuration=2e3),Object(n.b)(t,"Column")&&(t.defaultState.transitionDuration=700,t.hiddenState.transitionDuration=1e3,t.hiddenState.properties.opacity=1),Object(n.b)(t,"Column3D")&&(t.hiddenState.properties.opacity=0)};window.am4themes_animated=a}},["lhmh"]);
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -115,6 +115,12 @@
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="#serverlocations" class="nav-link">
|
||||
<i class="fas fa-globe-asia nav-icon"></i>
|
||||
<p>Server Locations</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#malware_check" class="nav-link">
|
||||
<i class="fab fa-searchengin nav-icon"></i>
|
||||
@@ -442,6 +448,34 @@
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end screenshots ================================== -->
|
||||
<style>
|
||||
#chartdiv {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<a id="serverlocations" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
<strong><i class="fas fa-globe-asia"></i> SERVER LOCATIONS</strong>
|
||||
</p>
|
||||
<div class="table-responsive">
|
||||
<div id="chartdiv"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.card -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end server locations ================================== -->
|
||||
<a id="malware_check" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
@@ -663,6 +697,10 @@
|
||||
<!-- DataTables -->
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %} "></script>
|
||||
<script src="{% static "adminlte/plugins/datatables-bs4/dataTables.bootstrap4.min.js" %}"></script>
|
||||
<script src="{% static "amcharts/core.js" %}"></script>
|
||||
<script src="{% static "amcharts/maps.js" %}"></script>
|
||||
<script src="{% static "amcharts/worldLow.js" %}"></script>
|
||||
<script src="{% static "amcharts/animated.js" %}"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
// Datatable
|
||||
@@ -682,4 +720,79 @@
|
||||
$(this).addClass("active");
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
// Themes begin
|
||||
am4core.useTheme(am4themes_animated);
|
||||
// Themes end
|
||||
|
||||
// Create map instance
|
||||
var chart = am4core.create("chartdiv", am4maps.MapChart);
|
||||
|
||||
// Set map definition
|
||||
chart.geodata = am4geodata_worldLow;
|
||||
|
||||
// Set projection
|
||||
chart.projection = new am4maps.projections.Miller();
|
||||
|
||||
// Create map polygon series
|
||||
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
|
||||
|
||||
// Exclude Antartica
|
||||
polygonSeries.exclude = ["AQ"];
|
||||
|
||||
// Make map load polygon (like country names) data from GeoJSON
|
||||
polygonSeries.useGeodata = true;
|
||||
|
||||
// Configure series
|
||||
var polygonTemplate = polygonSeries.mapPolygons.template;
|
||||
polygonTemplate.tooltipText = "{name}";
|
||||
polygonTemplate.polygon.fillOpacity = 0.6;
|
||||
|
||||
// Create hover state and set alternative fill color
|
||||
var hs = polygonTemplate.states.create("hover");
|
||||
hs.properties.fill = chart.colors.getIndex(0);
|
||||
|
||||
// Add image series
|
||||
var imageSeries = chart.series.push(new am4maps.MapImageSeries());
|
||||
imageSeries.mapImages.template.propertyFields.longitude = "longitude";
|
||||
imageSeries.mapImages.template.propertyFields.latitude = "latitude";
|
||||
imageSeries.mapImages.template.tooltipText = "{title}";
|
||||
imageSeries.mapImages.template.propertyFields.url = "url";
|
||||
|
||||
var circle = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle.radius = 3;
|
||||
circle.propertyFields.fill = "color";
|
||||
|
||||
var circle2 = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle2.radius = 3;
|
||||
circle2.propertyFields.fill = "color";
|
||||
|
||||
|
||||
circle2.events.on("inited", function(event){
|
||||
animateBullet(event.target);
|
||||
})
|
||||
|
||||
function animateBullet(circle) {
|
||||
var animation = circle.animate([{ property: "scale", from: 1, to: 5 }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
|
||||
animation.events.on("animationended", function(event){
|
||||
animateBullet(event.target.object);
|
||||
})
|
||||
}
|
||||
|
||||
var colorSet = new am4core.ColorSet();
|
||||
imageSeries.data = [
|
||||
{% if domains %}
|
||||
{% for domain, details in domains.items %}
|
||||
{% if details|key:"geolocation" %}
|
||||
{
|
||||
'title': '{{details|key:"geolocation"|key:"country_long"}}/{{details|key:"geolocation"|key:"region"}}',
|
||||
'latitude': {{details|key:"geolocation"|key:"latitude"}},
|
||||
'longitude': {{details|key:"geolocation"|key:"longitude"}},
|
||||
'color':colorSet.next()
|
||||
},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
];
|
||||
</script>
|
||||
{% endblock %}
|
||||
@@ -165,6 +165,12 @@
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="nav-item">
|
||||
<a href="#serverlocations" class="nav-link">
|
||||
<i class="fas fa-globe-asia nav-icon"></i>
|
||||
<p>Server Locations</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#malware_check" class="nav-link">
|
||||
<i class="fab fa-searchengin nav-icon"></i>
|
||||
@@ -1349,6 +1355,34 @@
|
||||
</section>
|
||||
{% endif %}
|
||||
<!-- ===========================end virus total ================================== -->
|
||||
<style>
|
||||
#chartdiv {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<a id="serverlocations" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
<strong><i class="fas fa-globe-asia"></i> SERVER LOCATIONS</strong>
|
||||
</p>
|
||||
<div class="table-responsive">
|
||||
<div id="chartdiv"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.card -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end server locations ================================== -->
|
||||
<a id="malware_check" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
@@ -1591,7 +1625,7 @@
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end trackers ================================== -->
|
||||
<a id="strings" class="anchor"></a>
|
||||
<a id="strings" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
@@ -1799,8 +1833,12 @@
|
||||
<!--end new UI-->
|
||||
{% block extra_scripts %}
|
||||
<!-- DataTables -->
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %} "></script>
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %}"></script>
|
||||
<script src="{% static "adminlte/plugins/datatables-bs4/dataTables.bootstrap4.min.js" %}"></script>
|
||||
<script src="{% static "amcharts/core.js" %}"></script>
|
||||
<script src="{% static "amcharts/maps.js" %}"></script>
|
||||
<script src="{% static "amcharts/worldLow.js" %}"></script>
|
||||
<script src="{% static "amcharts/animated.js" %}"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
// Datatable
|
||||
@@ -1820,4 +1858,82 @@
|
||||
$(this).addClass("active");
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
// Themes begin
|
||||
am4core.useTheme(am4themes_animated);
|
||||
// Themes end
|
||||
|
||||
// Create map instance
|
||||
var chart = am4core.create("chartdiv", am4maps.MapChart);
|
||||
|
||||
// Set map definition
|
||||
chart.geodata = am4geodata_worldLow;
|
||||
|
||||
// Set projection
|
||||
chart.projection = new am4maps.projections.Miller();
|
||||
|
||||
// Create map polygon series
|
||||
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
|
||||
|
||||
// Exclude Antartica
|
||||
polygonSeries.exclude = ["AQ"];
|
||||
|
||||
// Make map load polygon (like country names) data from GeoJSON
|
||||
polygonSeries.useGeodata = true;
|
||||
|
||||
// Configure series
|
||||
var polygonTemplate = polygonSeries.mapPolygons.template;
|
||||
polygonTemplate.tooltipText = "{name}";
|
||||
polygonTemplate.polygon.fillOpacity = 0.6;
|
||||
|
||||
// Create hover state and set alternative fill color
|
||||
var hs = polygonTemplate.states.create("hover");
|
||||
hs.properties.fill = chart.colors.getIndex(0);
|
||||
|
||||
// Add image series
|
||||
var imageSeries = chart.series.push(new am4maps.MapImageSeries());
|
||||
imageSeries.mapImages.template.propertyFields.longitude = "longitude";
|
||||
imageSeries.mapImages.template.propertyFields.latitude = "latitude";
|
||||
imageSeries.mapImages.template.tooltipText = "{title}";
|
||||
imageSeries.mapImages.template.propertyFields.url = "url";
|
||||
|
||||
var circle = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle.radius = 3;
|
||||
circle.propertyFields.fill = "color";
|
||||
|
||||
var circle2 = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle2.radius = 3;
|
||||
circle2.propertyFields.fill = "color";
|
||||
|
||||
|
||||
circle2.events.on("inited", function(event){
|
||||
animateBullet(event.target);
|
||||
})
|
||||
|
||||
function animateBullet(circle) {
|
||||
var animation = circle.animate([{ property: "scale", from: 1, to: 5 }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
|
||||
animation.events.on("animationended", function(event){
|
||||
animateBullet(event.target.object);
|
||||
})
|
||||
}
|
||||
|
||||
var colorSet = new am4core.ColorSet();
|
||||
imageSeries.data = [
|
||||
{% if domains %}
|
||||
{% for domain, details in domains.items %}
|
||||
{% if details|key:"geolocation" %}
|
||||
{
|
||||
'title': '{{details|key:"geolocation"|key:"country_long"}}/{{details|key:"geolocation"|key:"region"}}',
|
||||
'latitude': {{details|key:"geolocation"|key:"latitude"}},
|
||||
'longitude': {{details|key:"geolocation"|key:"longitude"}},
|
||||
'color':colorSet.next()
|
||||
},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
];
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
@@ -129,6 +129,12 @@
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="#serverlocations" class="nav-link">
|
||||
<i class="fas fa-globe-asia nav-icon"></i>
|
||||
<p>Server Locations</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#malware_check" class="nav-link">
|
||||
<i class="fab fa-searchengin nav-icon"></i>
|
||||
@@ -959,8 +965,9 @@
|
||||
<tbody>
|
||||
{% for item in file_analysis %}
|
||||
<tr>
|
||||
<td>{{ forloop.counter }}</td>
|
||||
<td>
|
||||
{{ item|key:"findings" }}
|
||||
{{ item|key:"finding" }}
|
||||
</td>
|
||||
<td>
|
||||
{% for cert_f in item|key:"files" %}
|
||||
@@ -980,6 +987,34 @@
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end file analysis ================================== -->
|
||||
<style>
|
||||
#chartdiv {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<a id="serverlocations" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
<strong><i class="fas fa-globe-asia"></i> SERVER LOCATIONS</strong>
|
||||
</p>
|
||||
<div class="table-responsive">
|
||||
<div id="chartdiv"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.card -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end server locations ================================== -->
|
||||
<a id="malware_check" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
@@ -1362,6 +1397,10 @@
|
||||
<!-- DataTables -->
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %} "></script>
|
||||
<script src="{% static "adminlte/plugins/datatables-bs4/dataTables.bootstrap4.min.js" %}"></script>
|
||||
<script src="{% static "amcharts/core.js" %}"></script>
|
||||
<script src="{% static "amcharts/maps.js" %}"></script>
|
||||
<script src="{% static "amcharts/worldLow.js" %}"></script>
|
||||
<script src="{% static "amcharts/animated.js" %}"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
// Datatable
|
||||
@@ -1381,4 +1420,79 @@
|
||||
$(this).addClass("active");
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
// Themes begin
|
||||
am4core.useTheme(am4themes_animated);
|
||||
|
||||
// Create map instance
|
||||
var chart = am4core.create("chartdiv", am4maps.MapChart);
|
||||
|
||||
// Set map definition
|
||||
chart.geodata = am4geodata_worldLow;
|
||||
|
||||
// Set projection
|
||||
chart.projection = new am4maps.projections.Miller();
|
||||
|
||||
// Create map polygon series
|
||||
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
|
||||
|
||||
// Exclude Antartica
|
||||
polygonSeries.exclude = ["AQ"];
|
||||
|
||||
// Make map load polygon (like country names) data from GeoJSON
|
||||
polygonSeries.useGeodata = true;
|
||||
|
||||
// Configure series
|
||||
var polygonTemplate = polygonSeries.mapPolygons.template;
|
||||
polygonTemplate.tooltipText = "{name}";
|
||||
polygonTemplate.polygon.fillOpacity = 0.6;
|
||||
|
||||
// Create hover state and set alternative fill color
|
||||
var hs = polygonTemplate.states.create("hover");
|
||||
hs.properties.fill = chart.colors.getIndex(0);
|
||||
|
||||
// Add image series
|
||||
var imageSeries = chart.series.push(new am4maps.MapImageSeries());
|
||||
imageSeries.mapImages.template.propertyFields.longitude = "longitude";
|
||||
imageSeries.mapImages.template.propertyFields.latitude = "latitude";
|
||||
imageSeries.mapImages.template.tooltipText = "{title}";
|
||||
imageSeries.mapImages.template.propertyFields.url = "url";
|
||||
|
||||
var circle = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle.radius = 3;
|
||||
circle.propertyFields.fill = "color";
|
||||
|
||||
var circle2 = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle2.radius = 3;
|
||||
circle2.propertyFields.fill = "color";
|
||||
|
||||
|
||||
circle2.events.on("inited", function(event){
|
||||
animateBullet(event.target);
|
||||
})
|
||||
|
||||
function animateBullet(circle) {
|
||||
var animation = circle.animate([{ property: "scale", from: 1, to: 5 }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
|
||||
animation.events.on("animationended", function(event){
|
||||
animateBullet(event.target.object);
|
||||
})
|
||||
}
|
||||
|
||||
var colorSet = new am4core.ColorSet();
|
||||
imageSeries.data = [
|
||||
{% if domains %}
|
||||
{% for domain, details in domains.items %}
|
||||
{% if details|key:"geolocation" %}
|
||||
{
|
||||
'title': '{{details|key:"geolocation"|key:"country_long"}}/{{details|key:"geolocation"|key:"region"}}',
|
||||
'latitude': {{details|key:"geolocation"|key:"latitude"}},
|
||||
'longitude': {{details|key:"geolocation"|key:"longitude"}},
|
||||
'color':colorSet.next()
|
||||
},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
];
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
@@ -137,6 +137,12 @@
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="nav-item">
|
||||
<a href="#serverlocations" class="nav-link">
|
||||
<i class="fas fa-globe-asia nav-icon"></i>
|
||||
<p>Server Locations</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#malware_check" class="nav-link">
|
||||
<i class="fab fa-searchengin nav-icon"></i>
|
||||
@@ -835,6 +841,34 @@
|
||||
</section>
|
||||
{% endif %}
|
||||
<!-- ===========================end virus total ================================== -->
|
||||
<style>
|
||||
#chartdiv {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<a id="serverlocations" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
<strong><i class="fas fa-globe-asia"></i> SERVER LOCATIONS</strong>
|
||||
</p>
|
||||
<div class="table-responsive">
|
||||
<div id="chartdiv"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.card -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end server locations ================================== -->
|
||||
<a id="malware_check" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
@@ -1139,6 +1173,10 @@
|
||||
<!-- DataTables -->
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %} "></script>
|
||||
<script src="{% static "adminlte/plugins/datatables-bs4/dataTables.bootstrap4.min.js" %}"></script>
|
||||
<script src="{% static "amcharts/core.js" %}"></script>
|
||||
<script src="{% static "amcharts/maps.js" %}"></script>
|
||||
<script src="{% static "amcharts/worldLow.js" %}"></script>
|
||||
<script src="{% static "amcharts/animated.js" %}"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
// Datatable
|
||||
@@ -1158,4 +1196,79 @@
|
||||
$(this).addClass("active");
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
// Themes begin
|
||||
am4core.useTheme(am4themes_animated);
|
||||
// Themes end
|
||||
|
||||
// Create map instance
|
||||
var chart = am4core.create("chartdiv", am4maps.MapChart);
|
||||
|
||||
// Set map definition
|
||||
chart.geodata = am4geodata_worldLow;
|
||||
|
||||
// Set projection
|
||||
chart.projection = new am4maps.projections.Miller();
|
||||
|
||||
// Create map polygon series
|
||||
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
|
||||
|
||||
// Exclude Antartica
|
||||
polygonSeries.exclude = ["AQ"];
|
||||
|
||||
// Make map load polygon (like country names) data from GeoJSON
|
||||
polygonSeries.useGeodata = true;
|
||||
|
||||
// Configure series
|
||||
var polygonTemplate = polygonSeries.mapPolygons.template;
|
||||
polygonTemplate.tooltipText = "{name}";
|
||||
polygonTemplate.polygon.fillOpacity = 0.6;
|
||||
|
||||
// Create hover state and set alternative fill color
|
||||
var hs = polygonTemplate.states.create("hover");
|
||||
hs.properties.fill = chart.colors.getIndex(0);
|
||||
|
||||
// Add image series
|
||||
var imageSeries = chart.series.push(new am4maps.MapImageSeries());
|
||||
imageSeries.mapImages.template.propertyFields.longitude = "longitude";
|
||||
imageSeries.mapImages.template.propertyFields.latitude = "latitude";
|
||||
imageSeries.mapImages.template.tooltipText = "{title}";
|
||||
imageSeries.mapImages.template.propertyFields.url = "url";
|
||||
|
||||
var circle = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle.radius = 3;
|
||||
circle.propertyFields.fill = "color";
|
||||
|
||||
var circle2 = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle2.radius = 3;
|
||||
circle2.propertyFields.fill = "color";
|
||||
|
||||
|
||||
circle2.events.on("inited", function(event){
|
||||
animateBullet(event.target);
|
||||
})
|
||||
|
||||
function animateBullet(circle) {
|
||||
var animation = circle.animate([{ property: "scale", from: 1, to: 5 }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
|
||||
animation.events.on("animationended", function(event){
|
||||
animateBullet(event.target.object);
|
||||
})
|
||||
}
|
||||
|
||||
var colorSet = new am4core.ColorSet();
|
||||
imageSeries.data = [
|
||||
{% if domains %}
|
||||
{% for domain, details in domains.items %}
|
||||
{% if details|key:"geolocation" %}
|
||||
{
|
||||
'title': '{{details|key:"geolocation"|key:"country_long"}}/{{details|key:"geolocation"|key:"region"}}',
|
||||
'latitude': {{details|key:"geolocation"|key:"latitude"}},
|
||||
'longitude': {{details|key:"geolocation"|key:"longitude"}},
|
||||
'color':colorSet.next()
|
||||
},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
];
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
@@ -123,6 +123,12 @@
|
||||
</p>
|
||||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="#serverlocations" class="nav-link">
|
||||
<i class="fas fa-globe-asia nav-icon"></i>
|
||||
<p>Server Locations</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#malware_check" class="nav-link">
|
||||
<i class="fab fa-searchengin nav-icon"></i>
|
||||
@@ -699,6 +705,35 @@
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end file analysis ================================== -->
|
||||
<!-- ===========================end virus total ================================== -->
|
||||
<style>
|
||||
#chartdiv {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<a id="serverlocations" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<p>
|
||||
<strong><i class="fas fa-globe-asia"></i> SERVER LOCATIONS</strong>
|
||||
</p>
|
||||
<div class="table-responsive">
|
||||
<div id="chartdiv"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /.card -->
|
||||
</div>
|
||||
<!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ===========================end server locations ================================== -->
|
||||
<a id="malware_check" class="anchor"></a>
|
||||
<section class="content">
|
||||
<div class="container-fluid">
|
||||
@@ -954,6 +989,10 @@
|
||||
<!-- DataTables -->
|
||||
<script src="{% static "adminlte/plugins/datatables/jquery.dataTables.min.js" %} "></script>
|
||||
<script src="{% static "adminlte/plugins/datatables-bs4/dataTables.bootstrap4.min.js" %}"></script>
|
||||
<script src="{% static "amcharts/core.js" %}"></script>
|
||||
<script src="{% static "amcharts/maps.js" %}"></script>
|
||||
<script src="{% static "amcharts/worldLow.js" %}"></script>
|
||||
<script src="{% static "amcharts/animated.js" %}"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
// Datatable
|
||||
@@ -973,4 +1012,79 @@
|
||||
$(this).addClass("active");
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
// Themes begin
|
||||
am4core.useTheme(am4themes_animated);
|
||||
// Themes end
|
||||
|
||||
// Create map instance
|
||||
var chart = am4core.create("chartdiv", am4maps.MapChart);
|
||||
|
||||
// Set map definition
|
||||
chart.geodata = am4geodata_worldLow;
|
||||
|
||||
// Set projection
|
||||
chart.projection = new am4maps.projections.Miller();
|
||||
|
||||
// Create map polygon series
|
||||
var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());
|
||||
|
||||
// Exclude Antartica
|
||||
polygonSeries.exclude = ["AQ"];
|
||||
|
||||
// Make map load polygon (like country names) data from GeoJSON
|
||||
polygonSeries.useGeodata = true;
|
||||
|
||||
// Configure series
|
||||
var polygonTemplate = polygonSeries.mapPolygons.template;
|
||||
polygonTemplate.tooltipText = "{name}";
|
||||
polygonTemplate.polygon.fillOpacity = 0.6;
|
||||
|
||||
// Create hover state and set alternative fill color
|
||||
var hs = polygonTemplate.states.create("hover");
|
||||
hs.properties.fill = chart.colors.getIndex(0);
|
||||
|
||||
// Add image series
|
||||
var imageSeries = chart.series.push(new am4maps.MapImageSeries());
|
||||
imageSeries.mapImages.template.propertyFields.longitude = "longitude";
|
||||
imageSeries.mapImages.template.propertyFields.latitude = "latitude";
|
||||
imageSeries.mapImages.template.tooltipText = "{title}";
|
||||
imageSeries.mapImages.template.propertyFields.url = "url";
|
||||
|
||||
var circle = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle.radius = 3;
|
||||
circle.propertyFields.fill = "color";
|
||||
|
||||
var circle2 = imageSeries.mapImages.template.createChild(am4core.Circle);
|
||||
circle2.radius = 3;
|
||||
circle2.propertyFields.fill = "color";
|
||||
|
||||
|
||||
circle2.events.on("inited", function(event){
|
||||
animateBullet(event.target);
|
||||
})
|
||||
|
||||
function animateBullet(circle) {
|
||||
var animation = circle.animate([{ property: "scale", from: 1, to: 5 }, { property: "opacity", from: 1, to: 0 }], 1000, am4core.ease.circleOut);
|
||||
animation.events.on("animationended", function(event){
|
||||
animateBullet(event.target.object);
|
||||
})
|
||||
}
|
||||
|
||||
var colorSet = new am4core.ColorSet();
|
||||
imageSeries.data = [
|
||||
{% if domains %}
|
||||
{% for domain, details in domains.items %}
|
||||
{% if details|key:"geolocation" %}
|
||||
{
|
||||
'title': '{{details|key:"geolocation"|key:"country_long"}}/{{details|key:"geolocation"|key:"region"}}',
|
||||
'latitude': {{details|key:"geolocation"|key:"latitude"}},
|
||||
'longitude': {{details|key:"geolocation"|key:"longitude"}},
|
||||
'color':colorSet.next()
|
||||
},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
];
|
||||
</script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user