Skip to content

Commit

Permalink
Fixed GNSS Tool (popups issue being resolved), added Moment Mag. tool…
Browse files Browse the repository at this point in the history 
…, and refined request logic.
  • Loading branch information
cosmic-tichy committed Jun 16, 2020
1 parent 486c704 commit 583ecaf
Show file tree
Hide file tree
Showing 8 changed files with 123 additions and 41 deletions.
43 changes: 27 additions & 16 deletions frontend/src/components/GNSS.vue
View file
Expand Up @@ -123,8 +123,6 @@
name: "GNSS-tools",
data() {
return {
gnss1: [false, ''],
gnss2: [false, ''],
selected: [],
kmltype_sel: '',
gs_latitude: '',
Expand Down Expand Up @@ -156,6 +154,8 @@
}
else {
const baseURI = 'http://127.0.0.1:8000/geogateway_django_app/gps_service'
const kmlURI = 'http://127.0.0.1:8000/geogateway_django_app/get_kml'
//request JSON dict of GPS_service details with query params from form
axios.get(baseURI, {
params: {
//
Expand All @@ -182,25 +182,30 @@
"vabs": this.gs_vabs
//
}
}).then(function (response){
var props = response.data
this.gnss1[0] = true;
this.gnss2[0] = true;
this.gnss1[1] = props.urls[0]
this.gnss2[1] = props.urls[2]
})
//use JSON results (filename and folder) to request raw kml text
.then(function (response) {
for (var i = 0; i < 3; i++) {
var props = response.data
axios.get(kmlURI, {
params: {
"file": props.results[i],
"folder": props.folder
},
responseType: 'text',
//emit raw kml text to parent map component
}).then(function (response) {
// console.log(response.data)
bus.$emit('gnssLayer', response.data);
})
}
})
}
this.$store.state.gnssState.gnss1 = this.gnss1;
this.$store.state.gnssState.gnss2 = this.gnss2;
console.log(this.gnss1)
console.log(this.$store.state.gnssState.gnss1)
bus.emit('gnssLayer');
},
drawToolbar() {
if (!this.$store.state.GNSS.drawToolbar) {
this.$store.state.GNSS.drawToolbar = true;
if (!this.drawToolBar) {
this.$store.state.drawToolBar = true;
bus.$emit('drawToolbar');
}
}
Expand All @@ -209,6 +214,12 @@
gnssState() {
return this.$store.state.gnssState;
},
globalLayers() {
return this.$store.state.globalLayers;
},
drawToolBar() {
return this.$store.state.drawToolBar;
}
// kmltype_sel: {
// get(){
// return this.GNSS.formData.kmltype_sel;
Expand Down
47 changes: 47 additions & 0 deletions frontend/src/components/MMCalc.vue
View file
@@ -0,0 +1,47 @@
<template>
<div>
<b-input-group prepend="Length" append="km">
<b-form-input v-model="mm_length" placeholder="249"></b-form-input>
</b-input-group>
<b-input-group prepend="Width" append="km">
<b-form-input v-model="mm_width" placeholder="120.0"></b-form-input>
</b-input-group>
<b-input-group prepend="Slip" append="m">
<b-form-input v-model="mm_slip" placeholder="23"></b-form-input>
</b-input-group>
<b-input-group prepend="Shear Modulus" append="10^11 dyne/cm^2">
<b-form-input v-model="mm_shear" placeholder="3"></b-form-input>
</b-input-group>
<b-button v-on:click="runMMC()">Calculate</b-button>
<div v-show="SM != null && MM != null">
<h3>Seismic Moment</h3><p>{{this.SM}}</p>
<h3>Moment Magnitude</h3><p>{{this.MM}}</p>
</div>
</div>
</template>

<script>
export default {
name: "MMCalc",
data(){
return {
mm_length: null,
mm_width: null,
mm_slip: null,
mm_shear: null,
SM: null,
MM: null,
};
},
methods: {
runMMC(){
this.SM = this.mm_length * this.mm_width * this.mm_slip * this.mm_shear * 1e23;
this.MM = 2 / 3 * Math.log(this.SM) / Math.log(10) - 10.7;
}
}
}
</script>

<style scoped>
</style>
37 changes: 19 additions & 18 deletions frontend/src/components/MyMap.vue
View file
Expand Up @@ -18,6 +18,7 @@
import 'leaflet-draw'
import "leaflet-draw/dist/leaflet.draw.css";
import TopNav from "./TopNav";
// import axios from "axios";
// import GeometryUtil from 'leaflet-geometryutil'
export default {
Expand All @@ -42,15 +43,12 @@
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, &copy; <a href="https://carto.com/attribution">CARTO</a>',
}).addTo(this.map);
bus.$on('mapToolsLayer', () =>
this.mapToolsLayer());
bus.$on('drawToolbar', () =>
this.drawToolbar());
bus.$on('gnssLayer', () =>
this.gnssLayer());
bus.$on('gnssLayer', (text) =>
this.gnssLayer(text));
Expand All @@ -76,6 +74,9 @@
this.map.addControl(drawControl);
this.map.addLayer(drawnItems);
//gets lat long width height of drawn rectangle and prints in console.
// TODO dynamically fill form input with results from drawn rectangle
this.map.on('draw:created', function (e) {
var type = e.layerType,
layer = e.layer;
Expand Down Expand Up @@ -109,18 +110,18 @@
}
}
},
gnssLayer(){
console.log(this.gnssState.gnss1[1])
for(var key in this.gnssState){
if(this.gnssState[key][0] &&
this.globalLayers[key] === null){
this.kmlLayer(this.gnssState[key][1], key);
}else if(!(this.gnssState[key][0]) &&
this.globalLayers[key] != null) {
this.map.removeLayer(this.globalLayers[key]);
this.globalLayers[key] = null;
}
}
gnssLayer(kmltext){
// console.log(this.globalLayers.gnss1)
const parser = new DOMParser();
const kml = parser.parseFromString(kmltext, 'text/xml');
const track = new L.KML(kml);
this.map.addLayer(track);
const bounds = track.getBounds();
this.map.fitBounds(bounds);
},
kmlLayer(url, layer) {
Expand Down Expand Up @@ -203,7 +204,7 @@
position: inherit;
height: 100%;
width: auto;
padding: 0px;
padding: 0;
/*float: right;*/
}
#refreshButton {
Expand Down
8 changes: 6 additions & 2 deletions frontend/src/components/ToolTabs.vue
View file
Expand Up @@ -10,7 +10,9 @@
</b-card-text></b-tab>
<b-tab title="Seismicity"><b-card-text>Tab contents 3</b-card-text></b-tab>
<b-tab title="Forecast"><b-card-text>Tab contents 3</b-card-text></b-tab>
<b-tab title="Magnitude"><b-card-text>Tab contents 3</b-card-text></b-tab>
<b-tab title="Magnitude"><b-card-text>
<MMCalc/>
</b-card-text></b-tab>
<b-tab title="Disloc"><b-card-text>Tab contents 3</b-card-text></b-tab>
<b-tab title="3D Imaging"><b-card-text>Tab contents 3</b-card-text></b-tab>
<b-tab title="Special Studies"><b-card-text>Tab contents 3</b-card-text></b-tab>
Expand All @@ -22,11 +24,13 @@
<script>
import MapTools from "./MapTools";
import GNSS from './GNSS'
import MMCalc from "./MMCalc";
export default {
name: "ToolTabs",
components: {
MapTools,
GNSS
GNSS,
MMCalc
}
}
</script>
Expand Down
5 changes: 3 additions & 2 deletions frontend/src/store/store.js
View file
Expand Up @@ -16,7 +16,7 @@ export const store = new Vuex.Store({
},
//layers all in one dict?
mapToolsState: {
ucerf: [false, 'https://raw.githubusercontent.com/GeoGateway/GeoGatewayStaticResources/master/kmz/ucerf3_black.kml'],
ucerf: [false, "https://raw.githubusercontent.com/GeoGateway/GeoGatewayStaticResources/master/kmz/ucerf3_black.kml"],
kml: [false, ''],
boundaries: [false, 'https://raw.githubusercontent.com/GeoGateway/GeoGatewayStaticResources/master/kmz/gz_2010_us_040_00_20m.kml'],
coasts: [false, 'https://raw.githubusercontent.com/GeoGateway/GeoGatewayStaticResources/master/kmz/ne_50m_coastline.kml'],
Expand All @@ -25,7 +25,8 @@ export const store = new Vuex.Store({
gnss1: [false, ''],
gnss2: [false, ''],

}
},
drawToolBar: false,

},
mutations: {
Expand Down
21 changes: 20 additions & 1 deletion geogateway_django_app/GeoGatewayData.py
View file
Expand Up @@ -4,12 +4,12 @@
# TODO: add error catching

GpsServiceUrl = "http://156.56.174.162:8000/gpsservice/kml?"
KmlPrefix = "http://156.56.174.162:8000/static"


def gps_service(request):
if request.method == 'GET':
print(request.GET.get("data"))
print()
# more efficient way of getting request params?
# getting request params from GET in GNSS.vue
payload = {
Expand All @@ -34,6 +34,25 @@ def gps_service(request):
print(payload)

data = requests.get(GpsServiceUrl, params=payload)
# gps_response = data.json()
# rawV = requests.get(gps_response["urls"][0])
# rawH = request.get(gps_response["urls"][2])
# raw = {"fileV": rawV, "fileH": rawH}

responseData = HttpResponse(data)
return responseData


def get_gnss_kml(request):
if request.method == 'GET':
folder = request.GET.get("folder")
file = request.GET.get("file")
url = KmlPrefix + '/' + folder + '/' + file
print('url:' + url)
data = requests.get(url)
responseData = HttpResponse(data)
return responseData




2 changes: 0 additions & 2 deletions geogateway_django_app/models.py
View file
@@ -1,3 +1 @@
from django.db import models

# Create your models here.
1 change: 1 addition & 0 deletions geogateway_django_app/urls.py
View file
Expand Up @@ -18,4 +18,5 @@
name="app",
),
url(r"^gps_service/", GeoGatewayData.gps_service),
url(r"^get_kml/", GeoGatewayData.get_gnss_kml)
]

0 comments on commit 583ecaf

Please sign in to comment.