mirror of
https://github.com/nasa/openmct.git
synced 2025-06-14 05:08:15 +00:00
[Plot] Add JSDoc
Add inline comments to Plot scripts. WTD-533.
This commit is contained in:
Victor Woeltjen
@ -1,4 +1,4 @@
|
||||
/*global define,moment,Promise*/
|
||||
/*global define*/
|
||||
|
||||
/**
|
||||
* Module defining PlotController. Created by vwoeltje on 11/12/14.
|
||||
@ -32,6 +32,13 @@ define(
|
||||
RANGE_TICKS = 7;
|
||||
|
||||
/**
|
||||
* The PlotController is responsible for any computation/logic
|
||||
* associated with displaying the plot view. Specifically, these
|
||||
* responsibilities include:
|
||||
*
|
||||
* * Describing axes and labeling.
|
||||
* * Handling user interactions.
|
||||
* * Deciding what needs to be drawn in the chart area.
|
||||
*
|
||||
* @constructor
|
||||
*/
|
||||
@ -50,6 +57,8 @@ define(
|
||||
formatter.formatDomainValue)(v);
|
||||
}
|
||||
|
||||
// Converts from pixel coordinates to domain-range,
|
||||
// to interpret mouse gestures.
|
||||
function mousePositionToDomainRange(mousePosition) {
|
||||
return new PlotPosition(
|
||||
mousePosition.x,
|
||||
@ -60,11 +69,36 @@ define(
|
||||
).getPosition();
|
||||
}
|
||||
|
||||
// Utility function to get the mouse position (in x,y
|
||||
// pixel coordinates in the canvas area) from a mouse
|
||||
// event object.
|
||||
function toMousePosition($event) {
|
||||
var target = $event.target,
|
||||
bounds = target.getBoundingClientRect();
|
||||
|
||||
return {
|
||||
x: $event.clientX - bounds.left,
|
||||
y: $event.clientY - bounds.top,
|
||||
width: bounds.width,
|
||||
height: bounds.height
|
||||
};
|
||||
}
|
||||
|
||||
// Convert a domain-range position to a displayable
|
||||
// position. This will subtract the domain offset, which
|
||||
// is used to bias domain values to minimize loss-of-precision
|
||||
// associated with conversion to a 32-bit floating point
|
||||
// format (which is needed in the chart area itself, by WebGL.)
|
||||
function toDisplayable(position) {
|
||||
return [ position[0] - domainOffset, position[1] ];
|
||||
}
|
||||
|
||||
// Update the drawable marquee area to reflect current
|
||||
// mouse position (or don't show it at all, if no marquee
|
||||
// zoom is in progress)
|
||||
function updateMarqueeBox() {
|
||||
// Express this as a box in the draw object, which
|
||||
// is passed to an mct-chart in the template for rendering.
|
||||
$scope.draw.boxes = marqueeStart ?
|
||||
[{
|
||||
start: toDisplayable(mousePositionToDomainRange(marqueeStart)),
|
||||
@ -73,9 +107,12 @@ define(
|
||||
}] : undefined;
|
||||
}
|
||||
|
||||
// Update the bounds (origin and dimensions) of the drawing area.
|
||||
function updateDrawingBounds() {
|
||||
var panZoom = panZoomStack.getPanZoom();
|
||||
|
||||
// Communicate pan-zoom state from stack to the draw object
|
||||
// which is passed to mct-chart in the template.
|
||||
$scope.draw.dimensions = panZoom.dimensions;
|
||||
$scope.draw.origin = [
|
||||
panZoom.origin[0] - domainOffset,
|
||||
@ -83,6 +120,7 @@ define(
|
||||
];
|
||||
}
|
||||
|
||||
// Update tick marks in scope.
|
||||
function updateTicks() {
|
||||
var tickGenerator = new PlotTickGenerator(panZoomStack, formatter);
|
||||
|
||||
@ -92,6 +130,8 @@ define(
|
||||
tickGenerator.generateRangeTicks(RANGE_TICKS);
|
||||
}
|
||||
|
||||
// Populate the scope with axis information (specifically, options
|
||||
// available for each axis.)
|
||||
function setupAxes(metadatas) {
|
||||
$scope.axes = [
|
||||
new PlotAxis("domain", metadatas, AXIS_DEFAULTS[0]),
|
||||
@ -99,34 +139,48 @@ define(
|
||||
];
|
||||
}
|
||||
|
||||
// Respond to newly-available telemetry data; update the
|
||||
// drawing area accordingly.
|
||||
function plotTelemetry() {
|
||||
var prepared, data, telemetry;
|
||||
var prepared, datas, telemetry;
|
||||
|
||||
// Get a reference to the TelemetryController
|
||||
telemetry = $scope.telemetry;
|
||||
|
||||
// Nothing to plot without TelemetryController
|
||||
if (!telemetry) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Ensure axes have been initialized (we will want to
|
||||
// get the active axis below)
|
||||
if (!$scope.axes) {
|
||||
setupAxes(telemetry.getMetadata());
|
||||
}
|
||||
|
||||
data = telemetry.getResponse();
|
||||
// Get data sets
|
||||
datas = telemetry.getResponse();
|
||||
|
||||
// Prepare data sets for rendering
|
||||
prepared = new PlotPreparer(
|
||||
data,
|
||||
datas,
|
||||
($scope.axes[0].active || {}).key,
|
||||
($scope.axes[1].active || {}).key
|
||||
);
|
||||
|
||||
// Fit to the boundaries of the data, but don't
|
||||
// override any user-initiated pan-zoom changes.
|
||||
panZoomStack.setBasePanZoom(
|
||||
prepared.getOrigin(),
|
||||
prepared.getDimensions()
|
||||
);
|
||||
|
||||
// Track the domain offset, used to bias domain values
|
||||
// to minimize loss of precision when converted to 32-bit
|
||||
// floating point values for display.
|
||||
domainOffset = prepared.getDomainOffset();
|
||||
|
||||
// Draw the buffers. Select color by index.
|
||||
$scope.draw.lines = prepared.getBuffers().map(function (buf, i) {
|
||||
return {
|
||||
buffer: buf,
|
||||
@ -140,19 +194,11 @@ define(
|
||||
updateTicks();
|
||||
}
|
||||
|
||||
function toMousePosition($event) {
|
||||
var target = $event.target,
|
||||
bounds = target.getBoundingClientRect();
|
||||
|
||||
return {
|
||||
x: $event.clientX - bounds.left,
|
||||
y: $event.clientY - bounds.top,
|
||||
width: bounds.width,
|
||||
height: bounds.height
|
||||
};
|
||||
}
|
||||
|
||||
// Perform a marquee zoom.
|
||||
function marqueeZoom(start, end) {
|
||||
// Determine what boundary is described by the marquee,
|
||||
// in domain-range values. Use the minima for origin, so that
|
||||
// it doesn't matter what direction the user marqueed in.
|
||||
var a = mousePositionToDomainRange(start),
|
||||
b = mousePositionToDomainRange(end),
|
||||
origin = [
|
||||
@ -164,7 +210,10 @@ define(
|
||||
Math.max(a[1], b[1]) - origin[1]
|
||||
];
|
||||
|
||||
// Push the new state onto the pan-zoom stack
|
||||
panZoomStack.pushPanZoom(origin, dimensions);
|
||||
|
||||
// Make sure tick marks reflect new bounds
|
||||
updateTicks();
|
||||
}
|
||||
|
||||
@ -173,25 +222,49 @@ define(
|
||||
$scope.draw = {};
|
||||
|
||||
return {
|
||||
/**
|
||||
* Get the color (as a style-friendly string) to use
|
||||
* for plotting the trace at the specified index.
|
||||
* @param {number} index the index of the trace
|
||||
* @returns {string} the color, in #RRGGBB form
|
||||
*/
|
||||
getColor: function (index) {
|
||||
return PlotPalette.getStringColor(index);
|
||||
},
|
||||
/**
|
||||
* Get the coordinates (as displayable text) for the
|
||||
* current mouse position.
|
||||
* @returns {string[]} the displayable domain and range
|
||||
* coordinates over which the mouse is hovered
|
||||
*/
|
||||
getHoverCoordinates: function () {
|
||||
return mousePosition ?
|
||||
mousePositionToDomainRange(
|
||||
mousePosition
|
||||
).map(formatValue) : [];
|
||||
},
|
||||
/**
|
||||
* Handle mouse movement over the chart area.
|
||||
* @param $event the mouse event
|
||||
*/
|
||||
hover: function ($event) {
|
||||
mousePosition = toMousePosition($event);
|
||||
if (marqueeStart) {
|
||||
updateMarqueeBox();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Initiate a marquee zoom action.
|
||||
* @param $event the mouse event
|
||||
*/
|
||||
startMarquee: function ($event) {
|
||||
mousePosition = marqueeStart = toMousePosition($event);
|
||||
updateMarqueeBox();
|
||||
},
|
||||
/**
|
||||
* Complete a marquee zoom action.
|
||||
* @param $event the mouse event
|
||||
*/
|
||||
endMarquee: function ($event) {
|
||||
mousePosition = toMousePosition($event);
|
||||
if (marqueeStart) {
|
||||
@ -201,13 +274,26 @@ define(
|
||||
updateDrawingBounds();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Check if the plot is zoomed or panned out
|
||||
* of its default state (to determine whether back/unzoom
|
||||
* controls should be shown)
|
||||
* @returns {boolean} true if not in default state
|
||||
*/
|
||||
isZoomed: function () {
|
||||
return panZoomStack.getDepth() > 1;
|
||||
},
|
||||
/**
|
||||
* Undo the most recent pan/zoom change and restore
|
||||
* the prior state.
|
||||
*/
|
||||
stepBackPanZoom: function () {
|
||||
panZoomStack.popPanZoom();
|
||||
updateDrawingBounds();
|
||||
},
|
||||
/**
|
||||
* Undo all pan/zoom changes and restore the initial state.
|
||||
*/
|
||||
unzoom: function () {
|
||||
panZoomStack.clearPanZoom();
|
||||
updateDrawingBounds();
|
||||
|
||||
Reference in New Issue
Block a user