Compare View
Commits (2)
Diff
Showing 1 changed file Inline Diff
src/app/component/graph/graph.component.html
View file @
99a1117
| <div class="sticky-top" style=" margin-top: -80px;margin-left: 50px; margin-right: 400px;"> | 1 | 1 | <div class="sticky-top" style=" margin-top: -80px;margin-left: 50px; margin-right: 400px;"> | |
| <div class="form-row"> | 2 | 2 | <div class="form-row"> | |
| <div class="form-group col-md-2 "> | 3 | 3 | <div class="form-group col-md-2 "> | |
| <label for="xaxis"></label> | 4 | 4 | <label for="xaxis"></label> | |
| <select #xaxis (change)='updateXaxis(xaxis.value)' id="xaxis" class="form-control"> | 5 | 5 | <select #xaxis (change)='updateXaxis(xaxis.value)' id="xaxis" class="form-control" style="width: 180px"> | |
| <option selected>Choose x axis</option> | 6 | 6 | <option selected>Choose x axis</option> | |
| <option [value]="'mmsi'">mmsi</option> | 7 | 7 | <option [value]="'mmsi'">mmsi</option> | |
| <option [value]="'time'">time</option> | 8 | 8 | <option [value]="'time'">time</option> | |
| <option [value]="'latitude'">latitude</option> | 9 | 9 | <option [value]="'latitude'">latitude</option> | |
| <option [value]="'longitude'">longitude</option> | 10 | 10 | <option [value]="'longitude'">longitude</option> | |
| <option [value]="'speedOverGround'">speedOverGround</option> | 11 | 11 | <option [value]="'speedOverGround'">speedOverGround</option> | |
| <option [value]="'courseOverGround'">courseOverGround</option> | 12 | 12 | <option [value]="'courseOverGround'">courseOverGround</option> | |
| <option [value]="'heading'">heading</option> | 13 | 13 | <option [value]="'heading'">heading</option> | |
| <option [value]="'vesselName'">vesselName</option> | 14 | 14 | <option [value]="'vesselName'">vesselName</option> | |
| <option [value]="'imo'">imo</option> | 15 | 15 | <option [value]="'imo'">imo</option> | |
| <option [value]="'callSign'">callSign</option> | 16 | 16 | <option [value]="'callSign'">callSign</option> | |
| <option [value]="'vesselType'">vesselType</option> | 17 | 17 | <option [value]="'vesselType'">vesselType</option> | |
| <option [value]="'status'">status</option> | 18 | 18 | <option [value]="'status'">status</option> | |
| <option [value]="'length'">length</option> | 19 | 19 | <option [value]="'length'">length</option> | |
| <option [value]="'width'">width</option> | 20 | 20 | <option [value]="'width'">width</option> | |
| <option [value]="'draft'">draft</option> | 21 | 21 | <option [value]="'draft'">draft</option> | |
| <option [value]="'cargo'">cargo</option> | 22 | 22 | <option [value]="'cargo'">cargo</option> | |
| </select> | 23 | 23 | </select> | |
| </div> | 24 | 24 | </div> | |
| <div class="form-group col-md-2 "> | 25 | 25 | <div class="form-group col-md-2 "> | |
| <label for="yaxis"></label> | 26 | 26 | <label for="yaxis"></label> | |
| <select #yaxis (change)='updateYaxis(yaxis.value)' id="yaxis" class="form-control"> | 27 | 27 | <select #yaxis (change)='updateYaxis(yaxis.value)' id="yaxis" class="form-control" style="width: 180px; margin-left: 60px"> | |
| <option selected>Choose y axis</option> | 28 | 28 | <option selected>Choose y axis</option> | |
| <option [value]="'mmsi'">mmsi</option> | 29 | 29 | <option [value]="'mmsi'">mmsi</option> | |
| <option [value]="'time'">time</option> | 30 | 30 | <option [value]="'time'">time</option> | |
| <option [value]="'latitude'">latitude</option> | 31 | 31 | <option [value]="'latitude'">latitude</option> | |
| <option [value]="'longitude'">longitude</option> | 32 | 32 | <option [value]="'longitude'">longitude</option> | |
| <option [value]="'speedOverGround'">speedOverGround</option> | 33 | 33 | <option [value]="'speedOverGround'">speedOverGround</option> | |
| <option [value]="'courseOverGround'">courseOverGround</option> | 34 | 34 | <option [value]="'courseOverGround'">courseOverGround</option> | |
| <option [value]="'heading'">heading</option> | 35 | 35 | <option [value]="'heading'">heading</option> | |
| <option [value]="'vesselName'">vesselName</option> | 36 | 36 | <option [value]="'vesselName'">vesselName</option> | |
| <option [value]="'imo'">imo</option> | 37 | 37 | <option [value]="'imo'">imo</option> | |
| <option [value]="'callSign'">callSign</option> | 38 | 38 | <option [value]="'callSign'">callSign</option> | |
| <option [value]="'vesselType'">vesselType</option> | 39 | 39 | <option [value]="'vesselType'">vesselType</option> | |
| <option [value]="'status'">status</option> | 40 | 40 | <option [value]="'status'">status</option> | |
| <option [value]="'length'">length</option> | 41 | 41 | <option [value]="'length'">length</option> | |
| <option [value]="'width'">width</option> | 42 | 42 | <option [value]="'width'">width</option> | |
| <option [value]="'draft'">draft</option> | 43 | 43 | <option [value]="'draft'">draft</option> | |
| <option [value]="'cargo'">cargo</option> | 44 | 44 | <option [value]="'cargo'">cargo</option> | |
| </select> | 45 | 45 | </select> | |
| </div> | 46 | 46 | </div> | |
| </div> | 47 | 47 | </div> | |
| </div> | 48 | 48 | </div> | |
| <plotly-plot [data]="graph.data" [layout]="graph.layout" | 49 | 49 | <plotly-plot [data]="graph.data" [layout]="graph.layout" | |
| [style]="{position: 'relative', width: '100%' , height:'100%'}"></plotly-plot> | 50 | 50 | [style]="{position: 'relative', width: '100%' , height:'100%'}"></plotly-plot> | |
| 51 | 51 | |||
| 52 | 52 | |||
| 53 | 53 |