- Improved function name regex rule

- made the datums function name be the regexed result
- Some code clean up

Author: HerrChaos

src/app/CreatePlotModal.ts

@@ -9,6 +9,7 @@ export default class CreatePlotModal extends Modal {
   plugin: ObsidianFunctionPlot;
   editor: Editor;
   options: PlotInputs;
+  // eslint-disable-next-line no-unused-vars
   onSubmit: (options: PlotInputs, renderer: rendererType) => void;
 
   constructor(

src/common/utils.ts

@@ -33,7 +33,7 @@ function parseLaTeX(
     ? latex
     : latex
         .replace(plugin.settings.decimalSeparator, ".")
-        .replace(/\w+\(x\)=/, "") // Replace any function name(x)= pattern
+        .replace(/\w+\(x\) *=/, "") // Replace any function name(x)= pattern
         .replace(/\\frac\{([^{}]+)\}\{([^{}]+)\}/g, "($1)/($2)")
         .replace(/\\cdot/g, "*")
         .replace(/\^{([^}]*)}/g, "^($1)")
@@ -160,7 +160,7 @@ export function toFunctionPlotOptions(
     grid: options.grid ?? undefined,
     disableZoom: options.disableZoom ?? undefined,
     tip: {
-      renderer: (x: number, y: number, index: number) => {
+      renderer: (x: number, y: number) => {
         return options.tip.renderer === undefined || options.tip.renderer === ""
           ? "(" + x.toFixed(2).toString() + "," + y.toFixed(2).toString() + ")"
           : options.tip.renderer

src/components/Plot/Constant.svelte

@@ -25,7 +25,6 @@
     if (!target) return;
     const rect = target.getBoundingClientRect();
     mousePos = { x: rect.right, y: rect.bottom };
-    console.log(mousePos);
   }
 </script>
 

src/components/Plot/Plot.svelte

@@ -6,33 +6,15 @@
 
   import { FunctionPlot } from "../../fnplot";
   import { onMount } from "svelte";
-  import PlotModal from "../PlotModal/PlotModal.svelte";
   import CreatePlotModal from "../../app/CreatePlotModal";
-  import { timeHours } from "d3";
-  import { insertPlot } from "../../common/utils";
 
   export let options: PlotInputs,
     plugin: ObsidianFunctionPlot,
     showConstantsSettings = false;
 
   let plotContainer: HTMLElement;
   let plot: FunctionPlot;
-  let prevGraphType = new Array();
-
-  onMount(() => {
-    createNewPlot();
-  });
-  // $: {
-  //   const scope = (
-  //     Object.entries(options.constants) as [string, ConstantInputs][]
-  //   ).reduce((scope_, [key, val]) => {
-  //     scope_[key] = val.value;
-  //     return scope_;
-  //   }, {});
-  //   options.data.forEach((datum) => {
-  //     datum.scope = scope;
-  //   });
-  // }
+  let prevGraphType = [];
 
   function createNewPlot() {
     // First destroy any existing plot completely
@@ -50,6 +32,21 @@
     plot.render();
   }
 
+  onMount(() => {
+    createNewPlot();
+  });
+  // $: {
+  //   const scope = (
+  //     Object.entries(options.constants) as [string, ConstantInputs][]
+  //   ).reduce((scope_, [key, val]) => {
+  //     scope_[key] = val.value;
+  //     return scope_;
+  //   }, {});
+  //   options.data.forEach((datum) => {
+  //     datum.scope = scope;
+  //   });
+  // }
+
   $: {
     if (options?.data) {
       for (let i = 0; i < options.data.length; i++) {

src/components/PlotModal/Function.svelte

@@ -26,7 +26,7 @@
     mousePos = { x: rect.right, y: rect.bottom };
   }
 
-  function handlePointsChange(e: MouseEvent) {
+  function handlePointsChange() {
     points += 1;
     datum.points.push([0, 0]);
   }
@@ -35,6 +35,17 @@
     points -= 1;
     datum.points.remove(datum.points[i]);
   }
+
+  $: {
+    if (datum.fnType === "linear" || datum.fnType === "polar") {
+      let fnString = datum.fnType === "linear" ? datum.fn : datum.r;
+      let match = fnString?.match(/\w+\(x\) *=/);
+
+      if (match) {
+        datum.name = match[0].replaceAll("=", "").replaceAll("(x)", "").trim();
+      }
+    }
+  }
 </script>
 
 <div class="functionplot-item-data">
@@ -72,7 +83,7 @@
 
           <IconWrapper
             style="align-self: center; transform: translateY(0.2em);"
-            on:click={(e) => removePoint(i)}
+            on:click={() => removePoint(i)}
           >
             <Delete size="1.1em" />
           </IconWrapper>
@@ -137,7 +148,7 @@
           <label for="skip-tip">Skip tip</label>
           <Switch id="skip-tip" bind:checked={datum.skipTip} />
         {/if}
-        {#if datum.fnType == "linear"}
+        {#if datum.fnType === "linear"}
           <label for="derivative">Derivative</label>
           <TextInput id="derivative" bind:value={datum.derivative.fn} />
         {/if}

src/components/PlotModal/PlotModal.svelte

@@ -57,7 +57,18 @@
   import { onMount } from "svelte";
   import OptionsFloater from "../Primitives/OptionsFloater.svelte";
 
-  onMount(async () => {
+  // create a new function item
+  function newDataItem() {
+    options.data = [
+      ...options.data,
+      Object.assign(JSON.parse(JSON.stringify(DEFAULT_FUNCTION_INPUTS)), {
+        id: Math.random().toString(36).substring(2, 9),
+        color: hueToHexRGB(hues.next().value as number),
+      }) as FunctionInputs,
+    ];
+  }
+
+  onMount(() => {
     // Get the currently selected text and set it as the first function
     const activeLeaf = plugin.app.workspace.getActiveViewOfType(MarkdownView);
     let selectedText = "";
@@ -85,17 +96,6 @@
     mousePos = { x: rect.right, y: rect.bottom };
   }
 
-  // create a new function item
-  function newDataItem() {
-    options.data = [
-      ...options.data,
-      Object.assign(JSON.parse(JSON.stringify(DEFAULT_FUNCTION_INPUTS)), {
-        id: Math.random().toString(36).substring(2, 9),
-        color: hueToHexRGB(hues.next().value as number),
-      }) as FunctionInputs,
-    ];
-  }
-
   $: {
     const constants = options.data.reduce((acc: string[], datum) => {
       const toParse: string[] = [],
@@ -109,6 +109,8 @@
       } else if (datum.fnType === "polar") {
         toParse.push(datum.r ?? "");
         ignored.push("theta");
+        ignored.push("^");
+        ignored.push("theta^");
       } // vector doesn't support constants currently
 
       toParse.forEach((fn: string) => {