chartjs zoom support + calculate macro

packages/api/src/utility/getChartExport.js

@@ -7,6 +7,9 @@ const getChartExport = (title, config, imageFile) => {
     <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.6.0/chart.min.js" integrity="sha512-GMGzUEevhWh8Tc/njS0bDpwgxdCJLQBWG3Z2Ct+JGOpVnEmjvNx6ts4v6A2XJf1HOrtOsfhv3hBKpK9kE5z8AQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-adapter-moment/1.0.0/chartjs-adapter-moment.min.js" integrity="sha512-oh5t+CdSBsaVVAvxcZKy3XJdP7ZbYUBSRCXDTVn0ODewMDDNnELsrG9eDm8rVZAQg7RsDD/8K3MjPAFB13o6eA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js" integrity="sha512-UXumZrZNiOwnTcZSHLOfcTs0aos2MzBWHXOHOuB0J/R44QB0dwY5JgfbvljXcklVf65Gc4El6RjZ+lnwd2az2g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/1.2.0/chartjs-plugin-zoom.min.js" integrity="sha512-TT0wAMqqtjXVzpc48sI0G84rBP+oTkBZPgeRYIOVRGUdwJsyS3WPipsNh///ay2LJ+onCM23tipnz6EvEy2/UA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
     <style>
         a { text-decoration: none }
 

packages/web/package.json

@@ -53,5 +53,8 @@
     "tslib": "^2.3.1",
     "typescript": "^4.4.3",
     "uuid": "^3.4.0"
+  },
+  "dependencies": {
+    "chartjs-plugin-zoom": "^1.2.0"
   }
 }

packages/web/src/charts/ChartCore.svelte

@@ -1,6 +1,7 @@
 <script lang="ts" context="module">
   import Chart from 'chart.js/auto';
   import 'chartjs-adapter-moment';
+  import zoomPlugin from 'chartjs-plugin-zoom';
 
   const getCurrentEditor = () => getActiveComponent('ChartCore');
 
@@ -15,6 +16,8 @@
     onClick: () => getCurrentEditor().exportChart(),
     testEnabled: () => getCurrentEditor() != null,
   });
+
+  Chart.register(zoomPlugin);
 </script>
 
 <script lang="ts">

packages/web/src/charts/DataChart.svelte

@@ -55,6 +55,26 @@
         text: chartTitle,
       };
     }
+    res['zoom'] = {
+      zoom: {
+        wheel: {
+          enabled: true,
+        },
+        pinch: {
+          enabled: true,
+        },
+        drag: {
+          enabled: true,
+          modifierKey: 'shift',
+        },
+        mode: 'x',
+      },
+      pan: {
+        enabled: true,
+        mode: 'x',
+      },
+    };
+
     return res;
   }
 

packages/web/src/freetable/macros.js

@@ -76,7 +76,8 @@ return value ? value.toString().replace(new RegExp(rtext, rflags), args.replace
         default: '3',
       },
     ],
-    description: 'Returns string of a specified length in which the beginning of the current string is padded with spaces or other character',
+    description:
+      'Returns string of a specified length in which the beginning of the current string is padded with spaces or other character',
     type: 'transformValue',
     code: `return modules.lodash.padStart(value, +args.length, args.character)`,
   },
@@ -98,7 +99,8 @@ return value ? value.toString().replace(new RegExp(rtext, rflags), args.replace
         default: '3',
       },
     ],
-    description: 'Returns string of a specified length in which the end of the current string is padded with spaces or other character',
+    description:
+      'Returns string of a specified length in which the end of the current string is padded with spaces or other character',
     type: 'transformValue',
     code: `return modules.lodash.padEnd(value, +args.length, args.character)`,
   },
@@ -275,6 +277,22 @@ return {
       },
     ],
   },
+  {
+    title: 'Calculation',
+    name: 'calculation',
+    group: 'Tools',
+    description: 'Custom expression. Use row.column_name for accessing column values, value for original value',
+    type: 'transformValue',
+    args: [
+      {
+        type: 'text',
+        label: 'Expression',
+        name: 'expression',
+        default: 'value',
+      },
+    ],
+    code: `return eval(args.expression);`,
+  },
   {
     title: 'Extract date fields',
     name: 'extractDateFields',