svelte-plots-basic 3.0.5 → 3.0.7

package/package.json

@@ -1,7 +1,7 @@
 {
    "name": "svelte-plots-basic",
    "description": "Svelte components for creating simple plots",
-   "version": "3.0.5",
+   "version": "3.0.7",
    "author": "Sergey Kucheryavskiy",
    "license": "MIT",
    "private": false,

package/src/2d/Axes.svelte

@@ -256,11 +256,11 @@
 
 
    {#if params.labelsFactor !== 0}
-      {@const x = coords.start + (n + 0.85) * coords.width  }
-      <text {x} y={coords.ltop} dx={0} dy={0} dominant-baseline="hanging"
+      {@const x = coords.start + n * coords.width  }
+      <text {x} y={coords.ltop} dx="1.2em" dy="-0.25em" dominant-baseline="hanging"
          fill={params.labelColor}
          font-size="{params.fontSize}em"
-         text-anchor="middle"
+         text-anchor="right"
       >{@html getTickFactorLabel(params.labelsFactor)}</text>
    {/if}
 {/snippet}

package/src/2d/ColormapLegend.svelte

@@ -40,6 +40,7 @@
 
    let {
       breaks,                                // vector with breaks for color intervals or vector with their indices
+      show = true,                           // logical, use to hide the element
       colmap,                                // array with colors for each interval
       labels = null,                         // optional vector with labels for interval boundaries or elements
       labelColor = Colors.CLEGEND_LABELS,    // color of labels
@@ -49,7 +50,7 @@
    // get axes context and set the parameters of colormap legend (the rest will be done by Axes component)
    const axes = getContext('axes');
    $effect(() => {
-      axes.setColmapLegend({show: true, breaks, colmap, labels, labelColor, fontSize})
+      axes.setColmapLegend({show, breaks, colmap, labels, labelColor, fontSize})
    });
 </script>
 

package/src/2d/Legend.svelte

@@ -46,6 +46,7 @@
 
    let {
       items,                     // array with text labels and their visual properties for each legend element.
+      show = true,               // logical, use to hide the element
 	   position = 'topleft',      // position of the legend ("topleft", "top", "topright", "right", "bottomright", etc).
       lineColor = Colors.LEGEND, // color of the legend box line
       lineWidth = 1,             // width (thickness) of the legend box line
@@ -122,7 +123,7 @@
       const newPosition = checkPosition(position);
       axes.setGroupLegend(
          newItems && newPosition ?
-         {show: true, position, items, lineColor, faceColor, lineWidth, fontSize} :
+         {show, position, items, lineColor, faceColor, lineWidth, fontSize} :
          {show: false, position: null, items: null}
       );
    });

package/src/2d/XAxis.svelte

@@ -26,11 +26,12 @@
 
    let {
       label,             // text label
-      showGrid = false,  // logical, show or not grid lines
       ticks,             // vector with numeric tick positions (by default is computed automatically)
       tickLabels,        // vector with labels for each tick (by default tick position values will be used)
       las = 1,           // orientation of tick labels (1 - horizontal, 2 - vertical)
-      whole = false      // should the tick positions be a whole number or not.
+      whole = false,     // should the tick positions be a whole number or not.
+      show = true,       // logical, use to hide the element
+      showGrid = false,  // logical, show or not grid lines
    } = $props();
 
    // get axes context and send axis parameters to parent
@@ -55,7 +56,7 @@
       }
 
       // activate axis
-      axes.setXAxis({show: true, error: error, label: axisLabel, ticks: ticksProcessed,
+      axes.setXAxis({show, error: error, label: axisLabel, ticks: ticksProcessed,
          labelHeight, showGrid, las, whole, tickLabels});
    });
 </script>

package/src/2d/YAxis.svelte

@@ -29,9 +29,10 @@
       label,             // text label
       ticks,             // vector with numeric tick positions (by default is computed automatically)
       tickLabels,        // vector with labels for each tick (by default tick values will be used)
-      showGrid = false,  // logical, show or not grid lines
       las = 1,           // orientation of tick labels (1 - horizontal, 2 - vertical)
-      whole = false      // should the ticks be a whole number or not
+      whole = false,     // should the ticks be a whole number or not
+      show = true,       // logical, use to hide the element
+      showGrid = false,  // logical, show or not grid lines
    } = $props();
 
 
@@ -58,7 +59,7 @@
       }
 
       // activate axis
-      axes.setYAxis({show: true, error: error, label: axisLabel, ticks: ticksProcessed,
+      axes.setYAxis({show, error: error, label: axisLabel, ticks: ticksProcessed,
          labelHeight, showGrid, las, whole, tickLabels, pos: 4});
    });
 </script>

package/src/constants.js

@@ -90,7 +90,7 @@ export const Colors = {
 
    "AXIS_LINE": "#303030",
    "AXIS_TICK": "#606060",
-   "CLEGEND_LABELS": "#606060"
+   "CLEGEND_LABELS": "#808080"
 }