ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-16 22:28:13 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Refactor plot actions to save space (#5201)

Browse Source 
* Move image export actions to 3-dot menu
* Move cursor guide and toggle grid lines to local controls for plots (on hover)
* toggle cursor and gridlines affect all plots in a stacked plot
* Fix tests
* Better message when exporting plots, fixed typo

Co-authored-by: Joe Pea <trusktr@gmail.com>
Co-authored-by: Charles Hacskaylo <charlesh88@gmail.com>
This commit is contained in:
Shefali Joshi
2022-05-20 11:41:01 -07:00
committed by GitHub
parent 1ca5271c3e
commit 48916564e4
12 changed files with 168 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/plugins/plot/stackedPlot/StackedPlot.vue
View File

@ -22,41 +22,6 @@
<template>
<div class="c-plot c-plot--stacked holder holder-plot has-control-bar">
<div
v-show="!hideExportButtons && !options.compact"
class="c-control-bar"
>
<span class="c-button-set c-button-set--strip-h">
<button
class="c-button icon-download"
title="Export This View's Data as PNG"
@click="exportPNG()"
>
<span class="c-button__label">PNG</span>
</button>
<button
class="c-button"
title="Export This View's Data as JPG"
@click="exportJPG()"
>
<span class="c-button__label">JPG</span>
</button>
</span>
<button
class="c-button icon-crosshair"
:class="{ 'is-active': cursorGuide }"
title="Toggle cursor guides"
@click="toggleCursorGuide"
>
</button>
<button
class="c-button"
:class="{ 'icon-grid-on': gridLines, 'icon-grid-off': !gridLines }"
title="Toggle grid lines"
@click="toggleGridLines"
>
</button>
</div>
<div class="l-view-section">
<stacked-plot-item
v-for="object in compositionObjects"
@ -69,6 +34,8 @@
:plot-tick-width="maxTickWidth"
@plotTickWidth="onTickWidthChange"
@loadingUpdated="loadingUpdated"
@cursorGuide="onCursorGuideChange"
@gridLines="onGridLinesChange"
/>
</div>
</div>
@ -184,20 +151,24 @@ export default {
this.hideExportButtons = false;
}.bind(this));
},
toggleCursorGuide() {
this.cursorGuide = !this.cursorGuide;
},
toggleGridLines() {
this.gridLines = !this.gridLines;
},
onTickWidthChange(width, plotId) {
if (!Object.prototype.hasOwnProperty.call(this.tickWidthMap, plotId)) {
return;
}
this.$set(this.tickWidthMap, plotId, width);
},
onCursorGuideChange(cursorGuide) {
this.cursorGuide = cursorGuide === true;
},
onGridLinesChange(gridLines) {
this.gridLines = gridLines === true;
},
getViewContext() {
return {
exportPNG: this.exportPNG,
exportJPG: this.exportJPG
};
}
}
};