svelte-plots-basic 2.2.0 → 2.2.2

package/package.json

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

package/src/2d/Axes.svelte

@@ -312,23 +312,23 @@
 
 </script>
 
-<div class="plot-container {'plot_' + $scale}"  bind:this={plotElement} class:plot_error={!$isOk}>
+<div class="plot-container" bind:this={plotElement} class:plot_error={!$isOk}>
 
    <svg class="plot" bind:this={plotElement} xmlns="http://www.w3.org/2000/svg"
       style={`font-family: Arial, Helvetica, sans-serif;font-size:${fontSize}px`}>
 
       <g style={lblStyleStr}>
-         <!-- x-axis label -->
-         {#if xLabel && xLabel !== ''}
-         <text x={0} y={(height + top) /2} dx={0} dy={0} transform={`rotate(-90, 10, ${height/2})`} style="font-size:1.1em;">{@html yLabel}</text>
-         {/if}
          <!-- y-axis label -->
          {#if yLabel && yLabel !== ''}
-         <text x={left + width/2 } y={height + top} dx={0} dy={5} style="font-size:1.1em;">{@html xLabel}</text>
+         <text x={0} y={(height + top) /2} dx={0} dy={0} transform={`rotate(-90, 10, ${height/2})`} style="font-size:1.1em;">{@html yLabel}</text>
+         {/if}
+         <!-- x-axis label -->
+         {#if xLabel && xLabel !== ''}
+         <text x={left + width/2 } y={height + top} dx={0} dy={5} alignment-baseline="hanging" style="font-size:1.1em;">{@html xLabel}</text>
          {/if}
          <!-- plot title -->
          {#if title && title !== ''}
-         <text x={left + width/2 } y={0} dx={0} dy={0} alignment-baseline="hanging" style="font-size:1.2em;">{@html title}</text>
+         <text x={left + width/2 } y={0} dx={0} dy={10} alignment-baseline="hanging" style="font-size:1.2em;">{@html title}</text>
          {/if}
       </g>
 
@@ -370,6 +370,7 @@
    .plot-container {
       font-family: Arial, Helvetica, sans-serif;
       box-sizing: border-box;
+      position: relative;
       min-width: 100px;
       min-height: 50px;
       width: 100%;
@@ -398,15 +399,14 @@
       display: block;
       box-sizing: border-box;
       position:absolute;
-
       padding: 0;
       margin: 0;
-      height: 100%;
+      left: 0;
+      top: 0;
+      bottom: 0;
+      right: 0;
       width: 100%;
-      max-height: 100%;
-      max-width: 100%;
-      min-height: 100%;
-      min-width: 100%;
+      height: 100%;
    }
 
    .axes-content {