Skip to content

F
FloodSimulation-Browser
Commit 398ca70b authored by icyrizard's avatar icyrizard
Browse files
Options

plot works

parent af88fa74
Expand all Show whitespace changes
Inline Side-by-side
Showing with 366 additions and 212 deletions
docs/proposal/Makefile 0 → 100644
View file @ 398ca70b
# default:
# rm -f *.aux *.toc *.log *.out *.pdf
# pdflatex proposel.tex
# bibtex proposel.aux
# pdflatex proposel.tex
# pdflatex proposel.tex
proposel.tex: title.tex fsb.tex
%.pdf: %.tex
pdflatex $^
pdflatex $^
%.bbl: %.bib
pdflatex $(^:.bib=.tex)
bibtex8 $(@:.bbl=.aux)
pdflatex $(^:.bib=.tex)
pdflatex $(^:.bib=.tex)
clean:
rm -f *.aux *.toc *.log *.out
realclean:
rm -f *.aux *.toc *.log *.out *.pdf
docs/proposal/fsb.tex
View file @ 398ca70b
This diff is collapsed.
docs/proposal/proposel.tex 0 → 100644
View file @ 398ca70b
\documentclass[a4paper, 11pt]{article}
\usepackage[T1]{fontenc}
\usepackage[utf8]{inputenc}
\usepackage[margin=2.5cm, nohead]{geometry}
\usepackage{palatino, url, multicol}
\usepackage{amssymb, graphicx, fancyhdr, latexsym, url, verbatim}
\usepackage{algorithm, algorithmic}
\usepackage{hyperref}
%\usepackage{natbib}
\usepackage[all]{xy}
\usepackage{listings}
\usepackage{cite}
\usepackage[english]{babel}
\usepackage[font=small,format=plain,labelfont=bf,up,textfont=it,up]{caption}
\usepackage{xspace}
%\usepackage{subfigure} % has to be loaded after caption to prevent clash Commented, because subfig is the newer (and presumably
% better) version of subfigure...
\usepackage{subfig}
\usepackage{xcolor}
%\usepackage[titles,subfigure]{tocloft}
%
%
%\setlength{\cftbeforesecskip}{0.1cm}
\newcommand{\todo}[1]{\colorbox{red}{\color{white}#1}}
\newcommand{\projectName}{Flood Simulation Browser\xspace}
% xspace only puts a space where we want one!
\addtolength{\footskip}{-200mm}
\addtolength{\headheight}{-05mm}
\addtolength{\headsep}{05mm}
\pagestyle{fancy}
\lhead{\projectName}
\rhead{\small F.S.B.}
%\cfoot{\footnotesize \textit{ \projectAbbreviation}\\[0.1cm] \small \thepage}
%\cfoot{}
%\rfoot{\thepage}
\setlength{\parindent}{0pt}
\setlength{\parskip}{10pt}
\begin{document}
\nocite{designing-touch, jQuery-Mobile, Siege}
\include{title}
%\thispagestyle{empty}
\newpage
\begin{abstract}
\end{abstract}
\input{fsb}
\newpage
\bibliographystyle{plain}
\bibliography{references}
\end{document}
\ No newline at end of file
docs/proposal/references.bib 0 → 100644
View file @ 398ca70b
@misc{Titanium-Appcelerator,
title = "Appcelerator, \url{http://www.appcelerator.com/}",
url = "\url{http://www.appcelerator.com/}",
}
@article{memoryleak,
title = "Why you should stay away from appcelerator titanium \\
\url{http://usingimho.wordpress.com/2011/0614/} \\
\url{why-you-should-stay-away-from-appcelerators-titanium/} ",
url = "\url{http://usingimho.wordpress.com/2011/06/14/why-you-should-stay-away-from-appcelerators-titanium/}",
author = "A. Dallera" ,
}
@misc{CSS3,
title = "CSS3 Support, \url{http://www.caniuse.com/}",
url = "\url{http://www.caniuse.com/}",
}
@misc{designing-touch,
title = "designing-touch",
author = "Clark, J.",
year = "2012",
url = "\url{http://www.netmagazine.com/features/designing-touch}",
note = "Retrieved March 31, 2012"
}
@misc{jQuery-Mobile,
title = "jQuery Mobile, \url{http://jquerymobile.com/}",
url = "\url{http://jquerymobile.com/}",
}
@misc{PhoneGap,
title = "PhoneGap, \url{http://www.phonegap.com/}",
url = "\url{http://www.phonegap.com/}",
}
@misc{sencha,
title = "CSS3 Support, \url{http://www.sencha.com/products/touch}",
url = "\url{http://www.sencha.com/products/touch}",
}
@misc{Siege,
title = "Siege, \url{http://www.joedog.org/siege-home/}",
url = "\url{http://www.joedog.org/siege-home/}",
}
%http://www.sencha.com/products/touch
%http://usingimho.wordpress.com/2011/06/14/why-you-should-stay-away-from-appcelerators-titanium/
%http://caniuse.com/
%http://www.joedog.org/siege-home/
%http://www.netmagazine.com/features/designing-touch John Clark 2012 on February 01, 2012
%http://www.appcelerator.com/
%http://jquerymobile.com/
%http://www.phonegap.com/
%\end{document}
docs/proposal/title.tex 0 → 100644
View file @ 398ca70b
\newcommand{\HRule}{\rule{\linewidth}{0.5mm}}
\begin{titlepage}
\begin{center}
\includegraphics[width=1\textwidth]{uva}\\[0.5cm]
\HRule \\[0.2cm]
{ \huge \LARGE \textbf{\projectName}\\[0.1cm]
\vspace{0.2cm}}
\HRule \\[0.4cm]
\Large \today
\vfill
\begin{tabular}{ll}
\textbf{Supervisor:} & \textbf{Executive:} \\
Robert Belleman - U.v.A & Richard Torenvliet \\
& stdnmr: 6138861 \\
& email: Richard.Torenvliet@student.uva.nl
\end{tabular}
\end{center}
\end{titlepage}
\ No newline at end of file
www/app/Api.js
View file @ 398ca70b
// GET /drfsm/<test_id>/results/izid/<izid>.csv
// for example
// GET /drfsm/5/results/izid/1234.csv
Ext.define('app.Api', {
mixins: ['Ext.mixin.Observable'],
singleton: true,
......@@ -13,7 +6,7 @@ Ext.define('app.Api', {
var me = this;
var requestName = Ext.Ajax.request({
method: 'GET',
url: 'http://sangkil.science.uva.nl:8003/area/1/izid.json?latlng=' + lat + ',' + lng,
url: 'http://sangkil.science.uva.nl:8003/area/'+area_id+'/izid.json?latlng=' + lat + ',' + lng,
success: function(response, opts){
var result = Ext.decode(response.responseText);
......@@ -21,26 +14,22 @@ Ext.define('app.Api', {
},
failure: function(){
console.log('failed to get izid');
console.log('getIzid: failed to get izid');
}
});
},
getCsvFile: function(test_id, izid) {
console.log(izid);
console.log()
console.log('/drfsm/'+test_id+'/results/izid/'+izid+'.csv');
var me = this;
var requestName = Ext.Ajax.request({
method: 'GET',
url: 'http://sangkil.science.uva.nl:8003/drfsm/'+test_id+'/results/izid/'+izid+'.csv',
success: function(response, opts){
console.log(opts)
me.fireEvent('gotCsv', response.responseText)
},
failure: function(){
console.log('failed to get csv file');
console.log('getCsvFile: failed to get csv file');
}
});
}
......
www/app/controller/ChartController.js
View file @ 398ca70b
......@@ -11,11 +11,13 @@ Ext.define('app.controller.ChartController', {
autoCreate: true,
},
chartData : {
ChartData : {
selector: 'flood-chart-id',
autoCreate: true,
},
ExpandButton: '#expand-button',
mapView: 'SimulationMap',
},
......@@ -26,11 +28,16 @@ Ext.define('app.controller.ChartController', {
'#closeChart': {
tap: 'closeFloodChart'
}
},
'#expand-button': {
tap: 'expandChart'
},
},
},
init: function(){
self.marker = null;
me = this;
app.Api.on({
gotIzid: function(izid){
......@@ -47,7 +54,19 @@ Ext.define('app.controller.ChartController', {
me = this;
this.getMapView().on({
gotClick: function(event){
app.Api.getIzid(event.latLng.lat(), event.latLng.lng())
if (self.marker != null) {
self.marker.setMap(null);
self.marker = null;
}
lat = event.latLng.lat();
lng = event.latLng.lng();
options = {
icon: 'resources/images/crosshair.png',
draggable: true,
raiseOnDrag: true,
};
self.marker = me.getMapView().createMarker([lat, lng], options);
app.Api.getIzid(lat, lng, me.getMapView().areaId)
}
});
},
......@@ -63,31 +82,31 @@ Ext.define('app.controller.ChartController', {
for (i = 1; i < array.length; i++)
{
line_clmns = array[i].split(',');
console.log(parseInt(line_clmns[0]));
data.push({
time : time.push(parseInt(line_clmns[0]) + i * 100),
volume : volume.push(line_clmns[1])
time : parseInt(line_clmns[0]),
volume : parseInt(line_clmns[2]),
time1 : parseInt(line_clmns[0]),
volume1: parseInt(line_clmns[2])
});
}
console.log(data);
store.setData(data);
this.openChart();
},
getFile: function(result){
app.Api.getCsvFile(result['izid']);
openChart: function(){
this.getFloodchart().showBy(this.getMapView(), 'bl-bl');
},
closeFloodChart: function(){
this.getFloodchart().hide();
},
getData: function(latLng){
app.Api.getIzid(latLng.lat(), latLng.lng())
},
expandChart: function(){
}
openChart: function(){
this.getFloodchart().showBy(this.getMapView());
},
});
\ No newline at end of file
www/app/controller/Main.js
View file @ 398ca70b
......@@ -373,8 +373,4 @@ Ext.define('app.controller.Main', {
this.SimulType = 'Flood'
this.getSimulationOptions().hide();
},
pushSimulationList: function(){
//this.getSidepanel().push(this.getLsmSimulation());
}
});
www/app/store/chartStore.js
View file @ 398ca70b
......@@ -2,13 +2,13 @@ Ext.define('app.store.chartStore', {
extend: 'Ext.data.JsonStore',
config : {
fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
data: [
{'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
{'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
{'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
{'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
{'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}
]
fields: ['time', 'volume'],
// data: [
// {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
// {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
// {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
// {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
// {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}
// ]
}
});
\ No newline at end of file
www/app/view/Chart.js
View file @ 398ca70b
// var drawComponent = new Ext.draw.Component({
// config: {
// width: 100,
// },
// items: [{
// type: 'circle',
// fill: '#79BB3F',
// radius: 20,
// }]
// });
// var store = new Ext.data.JsonStore({
// fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
// data: [
// {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
// {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
// {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
// {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
// {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}
// ]
// });
// var chart = new Ext.chart.Chart({
// //animate: true,
// store: store,
// width: 500,
// height: 200,
// axes: [
// {
// type: "Numeric",
// position: 'left',
// fields: ['data1', 'data2', 'data3', 'data4', 'data5'],
// title: 'Numeric',
// minimum: 0,
// },
// {
// type: 'Category',
// position: 'bottom',
// fields: ['name'],
// title: 'Category',
// label: {
// rotate: {
// degrees: 35
// }
// }
// }
// ],
// series: [{
// type: 'area',
// highlight: false,
// axis: 'left',
// xField: 'name',
// yField: ['data1', 'data2', 'data3', 'data4', 'data5'],
// style: {
// opacity: 0.93
// }
// }]
// });
Ext.define('app.view.Chart', {
extend: 'Ext.Panel',
id: 'flood-chart',
......@@ -67,45 +6,53 @@ Ext.define('app.view.Chart', {
config: {
width: 520,
height: 220,
draggable: true,
height: 420,
layout: 'fit',
draggable: false,
items: [{
xtype: 'chart',
theme: 'Base',
animate: true,
id: 'flood-chart-id',
store: 'chartStore',
width: 500,
height: 200,
width: 520,
height: 400,
axes: [
{
type: "Numeric",
position: 'left',
fields: ['data1', 'data2', 'data3', 'data4', 'data5'],
title: 'Numeric',
fields: ['volume'],
title: 'Volume',
minimum: 0,
adjustMinimumByMajorUnit: 0,
},
{
type: 'Category',
position: 'bottom',
fields: ['name'],
title: 'Category',
label: {
rotate: {
degrees: 35
}
}
fields: ['time'],
title: 'Time Step',
minimum: 0,
adjustMinimumByMajorUnit: 0,
}
],
series: [{
type: 'area',
type: 'line',
highlight: false,
smooth: true,
axis: 'left',
xField: 'name',
yField: ['data1', 'data2', 'data3', 'data4', 'data5'],
style: {
opacity: 0.93
}
}]
xField: ['time'],
yField: ['volume'],
}],
// interactions: [
// {
// type: 'panzoom',
// axes: ['bottom', 'left']
// },
// {
// type: 'reset'
// }]
},
{
xtype: 'button',
......@@ -117,25 +64,22 @@ Ext.define('app.view.Chart', {
height: 30,
cls: 'closebutton',
style: 'background: url(resources/images/closebutton50.png) no-repeat; background-size: 30px; border: none',
}],
// {
// xtype: 'button',
// ui: 'toggle',
// top: 0,
// right: 0,
// text: 'drag'
// },
// {
// xtype: 'button',
// id: 'expand-button',
// bottom: 0,
// right: 0,
// iconCls: 'expand',
// iconMask: true,
}]
// }]
}
});
\ No newline at end of file
// (function(){
// var drawComponent = new Ext.draw.Component({
// items: [{
// type: 'circle',
// fill: '#79BB3F',
// radius: 100,
// x: 100,
// y: 100
// }]
// });
// new Ext.Panel({
// fullscreen: true,
// items: [drawComponent]
// });
// })();
www/app/view/List.js
View file @ 398ca70b
......@@ -15,7 +15,7 @@ Ext.define("app.view.List",
navigationBar:
{
title: 'simulations',
ui: 'charcoal',
items : [{
id: 'simulationOptions',
xtype: 'button',
......
www/app/view/Map.js
View file @ 398ca70b
......@@ -49,22 +49,34 @@ Ext.define('app.view.Map', {
alterMapOptions: function(options){
this.globalExtMap.setMapOptions(options);
},
/*
* createMarker:
* sets marker at pos
/* sets marker at pos
* @params:
* pos = [latitude, longitude]
*
*/
createMarker: function(pos){
createMarker: function(pos, options){
var pos = new google.maps.LatLng(pos[0], pos[1]);
new google.maps.Marker({
if (options != null){
icon = options['icon'] || 'resources/images/Google_Maps_Marker.png';
draggable = options['draggable'] || false;
raiseOnDrag = options['raiseOnDrag'] || false;
}
else {
icon = 'resources/images/Google_Maps_Marker.png';
draggable = false;
raiseOnDrag = false;
}
marker = new google.maps.Marker({
position: pos,
icon: 'resources/images/Google_Maps_Marker.png',
icon: icon,
map: this.globalMap,
title: 'you'
title: 'you',
raiseOnDrag: true,
draggable: draggable,
});
return marker;
},
// 'http://sangkil.science.uva.nl:8003/drfsm/199419691/visualization/level/map/600.png'
......@@ -105,7 +117,7 @@ Ext.define('app.view.Map', {
/*remove clickevent and add to new image*/
if (this.listeners_ref != null)
google.maps.event.removeListener(listenerHandle);
google.maps.event.removeListener(this.listeners_ref);
this.listeners_ref = google.maps.event.addListener(this.overlayImages[0], 'click', function(event){
me.fireEvent('gotClick', event);
......@@ -124,8 +136,10 @@ Ext.define('app.view.Map', {
//this.overlayImages[this.imageIndex - 1].setMap(null);
this.overlayImages[this.imageIndex].setMap(this.globalMap);
if (this.listeners_ref != null)
google.maps.event.removeListener(listenerHandle);
if (this.listeners_ref != null){
google.maps.event.removeListener(this.listeners_ref);
}
this.listeners_ref = google.maps.event.addListener(this.overlayImages[this.imageIndex], 'click', function(event){
me.fireEvent('gotClick', event);
......
www/app/view/Simulation.js
View file @ 398ca70b
......@@ -9,13 +9,7 @@ Ext.define('app.view.Simulation', {
{
docked: 'top',
xtype: 'toolbar',
ui: 'charcoal',
title: 'Flood Simulation Browser',
items: [{
id: 'create-chart',
xtype: 'button',
text: 'create chart',
}]
},
{
xtype: 'SimulationMap',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment