Expose axes limits in viewer options

glue_jupyter/common/state_widgets/viewer_image.py

@@ -1,9 +1,11 @@
 from glue.viewers.image.state import AggregateSlice
 from glue.core.coordinate_helpers import world_axis
 import ipyvuetify as v
+import ipywidgets as widgets
 import traitlets
 from ...state_traitlets_helpers import GlueState
 from ...vuetify_helpers import link_glue_choices
+from ...widgets import AxesLimits
 
 
 __all__ = ['ImageViewerStateWidget']
@@ -28,6 +30,8 @@ class ImageViewerStateWidget(v.VuetifyTemplate):
 
     sliders = traitlets.List().tag(sync=True)
 
+    axes_limits_widget = traitlets.Any().tag(sync=True, **widgets.widget_serialization)
+
     def __init__(self, viewer_state):
         super().__init__()
 
@@ -54,6 +58,8 @@ def __init__(self, viewer_state):
 
         self._sync_sliders_from_state()
 
+        self.axes_limits_widget = AxesLimits(viewer_state)
+
     def _sync_sliders_from_state(self, *not_used):
 
         if self.viewer_state.reference_data is None or self.viewer_state.slices is None:

glue_jupyter/common/state_widgets/viewer_image.vue

@@ -28,6 +28,9 @@
                 v-if="glue_state.slices && glue_state.slices.length > 0"
                 wait="300" :max="slider.max" :value.sync="glue_state.slices[slider.index]" hide-details />
         </div>
+        <div>
+            <jupyter-widget :widget="axes_limits_widget"></jupyter-widget>
+        </div>
     </div>
 </template>
 <script>

glue_jupyter/common/state_widgets/viewer_profile.py

@@ -1,7 +1,9 @@
 import ipyvuetify as v
+import ipywidgets as widgets
 import traitlets
 from ...state_traitlets_helpers import GlueState
 from ...vuetify_helpers import link_glue_choices
+from ...widgets import AxesLimits
 
 __all__ = ['ProfileViewerStateWidget']
 
@@ -26,6 +28,8 @@ class ProfileViewerStateWidget(v.VuetifyTemplate):
     y_display_unit_items = traitlets.List().tag(sync=True)
     y_display_unit_selected = traitlets.Int(allow_none=True).tag(sync=True)
 
+    axes_limits_widget = traitlets.Any().tag(sync=True, **widgets.widget_serialization)
+
     def __init__(self, viewer_state):
         super().__init__()
 
@@ -36,3 +40,5 @@ def __init__(self, viewer_state):
         link_glue_choices(self, viewer_state, 'function')
         link_glue_choices(self, viewer_state, 'x_display_unit')
         link_glue_choices(self, viewer_state, 'y_display_unit')
+
+        self.axes_limits_widget = AxesLimits(viewer_state)

glue_jupyter/common/state_widgets/viewer_profile.vue

@@ -16,6 +16,10 @@
             <v-select :items="function_items" label="function" v-model="function_selected"/>
         </div>
 
+        <div>
+            <jupyter-widget :widget="axes_limits_widget"></jupyter-widget>
+        </div>
+
         <div class="d-inline-flex flex-wrap">
             <v-btn-toggle dense multiple :value="modeSet" @change="modeSetChange" style="margin-right: 8px">
 

glue_jupyter/widgets/__init__.py

@@ -1,5 +1,6 @@
+from .axes_limits import AxesLimits
 from .color import Color
 from .size import Size
 from .linked_dropdown import LinkedDropdown
 
-__all__ = ['Color', 'Size', 'LinkedDropdown']
+__all__ = ['AxesLimits', 'Color', 'Size', 'LinkedDropdown']

glue_jupyter/widgets/axes_limits.py

@@ -0,0 +1,38 @@
+import traitlets
+import ipyvuetify as v
+from echo import delay_callback
+from ..link import dlink
+from ..state_traitlets_helpers import GlueState
+
+__all__ = ['AxesLimits']
+
+
+class AxesLimits(v.VuetifyTemplate):
+    template_file = (__file__, 'axes_limits.vue')
+
+    glue_state = GlueState().tag(sync=True)
+
+    x_min = traitlets.Float(default_value=None, allow_none=True).tag(sync=True)
+    x_max = traitlets.Float(default_value=None, allow_none=True).tag(sync=True)
+    y_min = traitlets.Float(default_value=None, allow_none=True).tag(sync=True)
+    y_max = traitlets.Float(default_value=None, allow_none=True).tag(sync=True)
+
+    def __init__(self, viewer_state):
+        super().__init__()
+        self.glue_state = viewer_state
+        dlink((self.glue_state, 'x_min'), (self, 'x_min'))
+        dlink((self.glue_state, 'x_max'), (self, 'x_max'))
+        dlink((self.glue_state, 'y_min'), (self, 'y_min'))
+        dlink((self.glue_state, 'y_max'), (self, 'y_max'))
+
+    def vue_apply_limits(self, data):
+        self._cache = (self.x_min, self.x_max, self.y_min, self.y_max)
+        with delay_callback(self.glue_state, 'x_min', 'x_max', 'y_min', 'y_max'):
+            if self.x_min is not None:
+                self.glue_state.x_min = self.x_min
+            if self.x_max is not None:
+                self.glue_state.x_max = self.x_max
+            if self.y_min is not None:
+                self.glue_state.y_min = self.y_min
+            if self.y_max is not None:
+                self.glue_state.y_max = self.y_max

glue_jupyter/widgets/axes_limits.vue

@@ -0,0 +1,27 @@
+<template>
+  <div>
+  <v-row no-gutters>
+    <v-col cols="6">
+      <glue-float-field class="mr-1" label="xmin" :value.sync="x_min" />
+    </v-col>
+    <v-col  cols="6">
+      <glue-float-field class="ml-1" label="xmax" :value.sync="x_max" />
+    </v-col>
+  </v-row>
+  <v-row no-gutters>
+    <v-col cols="6">
+      <glue-float-field class="mr-1" label="ymin" :value.sync="y_min" />
+    </v-col>
+    <v-col cols="6">
+      <glue-float-field class="ml-1" label="ymax" :value.sync="y_max" />
+    </v-col>
+  </v-row>
+  <v-row>
+    <v-col class="text-center" cols="12">
+    <v-btn @click="apply_limits">
+      Apply limits
+    </v-btn>
+    </v-col>
+  </v-row>
+  </div>
+</template>