ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-03 08:00:52 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Plot] Add notion of subplots to template

Browse Source 
Add notion of subplots to the plot template; these
are elements within a stacked plot. WTD-625.
This commit is contained in:
Victor Woeltjen 2014-12-10 18:55:47 -08:00
parent 01f1a92d09
commit 1c3d2d923f
1 changed files with 132 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
platform/features/plot/res/templates/plot.html
View File

@ -3,15 +3,17 @@
<span ng-controller="PlotController as plot" <span ng-controller="PlotController as plot"
ng-mouseleave="representation.showControls = false"> ng-mouseleave="representation.showControls = false">
<span ng-repeat="subplot in plot.getSubPlots()">
<div class="gl-plot-legend"> <div class="gl-plot-legend">
<span class='plot-legend-item' <span class='plot-legend-item'
ng-repeat="telemetryObject in telemetry.getTelemetryObjects() track by $index"> ng-repeat="telemetryObject in subplot.telemetryObjects">
<span class='plot-color-swatch' ng-style="{ 'background-color': plot.getColor($index) }"></span> <span class='plot-color-swatch'
ng-style="{ 'background-color': plot.getColor($index) }">
</span>
<span class='title-label'>{{telemetryObject.getModel().name}}</span> <span class='title-label'>{{telemetryObject.getModel().name}}</span>
</span> </span>
</div> </div>
<div class="gl-plot-coords" <div class="gl-plot-coords"
ng-if="representation.showControls"> ng-if="representation.showControls">
{{plot.getHoverCoordinates().join(', ')}} {{plot.getHoverCoordinates().join(', ')}}
@ -45,26 +47,26 @@
<div class="gl-plot-display-area" <div class="gl-plot-display-area"
ng-mouseenter="representation.showControls = true"> ng-mouseenter="representation.showControls = true">
<div class="gl-plot-hash hash-v" <div class="gl-plot-hash hash-v"
ng-repeat="tick in domainTicks" ng-repeat="tick in subplot.domainTicks"
ng-style="{ left: (100 * $index / (domainTicks.length - 1)) + '%', height: '100%' }" ng-style="{ left: (100 * $index / (subplot.domainTicks.length - 1)) + '%', height: '100%' }"
ng-show="$index > 0 && $index < (domainTicks.length - 1)"> ng-show="$index > 0 && $index < (subplot.domainTicks.length - 1)">
</div> </div>
<div class="gl-plot-hash hash-h" <div class="gl-plot-hash hash-h"
ng-repeat="tick in rangeTicks" ng-repeat="tick in rangeTicks"
ng-style="{ bottom: (100 * $index / (rangeTicks.length - 1)) + '%', width: '100%' }" ng-style="{ bottom: (100 * $index / (subplot.rangeTicks.length - 1)) + '%', width: '100%' }"
ng-show="$index > 0 && $index < (rangeTicks.length - 1)"> ng-show="$index > 0 && $index < (subplot.rangeTicks.length - 1)">
</div> </div>
<mct-chart draw="draw" <mct-chart draw="subplot.draw"
ng-mousemove="plot.hover($event)" ng-mousemove="subplot.hover($event)"
ng-mousedown="plot.startMarquee($event)" ng-mousedown="subplot.startMarquee($event)"
ng-mouseup="plot.endMarquee($event)"> ng-mouseup="subplot.endMarquee($event)">
</mct-chart> </mct-chart>
<!-- TODO: Move into correct position; make part of group; infer from set of actions --> <!-- TODO: Move into correct position; make part of group; infer from set of actions -->
<div class="gl-plot-local-controls" <div class="gl-plot-local-controls"
ng-if="$first"
ng-show="representation.showControls" ng-show="representation.showControls"
style="position: absolute; top: 8px; right: 8px;"> style="position: absolute; top: 8px; right: 8px;">
@ -113,8 +115,7 @@
<span class="t-wait-spinner loading" ng-show="telemetry.isRequestPending()"> <span class="t-wait-spinner loading" ng-show="telemetry.isRequestPending()">
</span> </span>
</div> </div>
<div ng-if="$last" class="gl-plot-axis-area gl-plot-x">
<div class="gl-plot-axis-area gl-plot-x">
<div ng-repeat="tick in domainTicks" <div ng-repeat="tick in domainTicks"
class="gl-plot-tick gl-plot-x-tick-label" class="gl-plot-tick gl-plot-x-tick-label"
@ -141,5 +142,8 @@
</div> </div>
</span> </span>
</span>
</div> </div>