我需要操作SVG的绘制,所以我有如下属性"d"值:

d = "M561.5402,268.917 C635.622,268.917 304.476,565.985 379.298,565.985"

我想要的是"净化"所有的值(go 掉它们的字符),计算它们(为了简单起见,我们假设每个值加100),解构字符串,计算其中的值,然后将它们连接在一起,最终结果如下所示:

d = "M661.5402,368.917 C735.622,368.917 404.476,665.985 479.298,665.985"

请记住:

  • 某些值可以以字符开头
  • 值由逗号分隔
  • 逗号分隔符内的某些值可以用空格分隔
  • 值为十进制

这是我的try :

    let arr1 = d.split(',');
    arr1 = arr1.map(element => {
      let arr2 = element.split(' ');
      if (arr2.length > 1) {
        arr2 = arr2.map(el => {
          let startsWithChar = el.match(/\D+/);
          if (startsWithChar) {
            el = el.replace(/\D/g,'');
          }
          el = parseFloat(el) + 100;
          if (startsWithChar) {
            el = startsWithChar[0] + el;
          }
        })
      }
      else {
        let startsWithChar = element.match(/\D+/);
        if (startsWithChar) {
          element = element.replace(/\D/g,'');
        }
        element = parseFloat(element) + 100;
        if (startsWithChar) {
          element = startsWithChar[0] + element;
        }
      }          
    });
    d = arr1.join(',');

我try 了正则表达式replace(/\D/g,''),但它也go 掉了值中的小数点,所以我认为我的解决方案充满了漏洞.

也许另一种解决方案是以某种方式直接修改每个路径值/命令,我也对该解决方案持开放态度,但我不知道如何修改.

推荐答案

const s = 'M561.5402,268.917 C635.622,268.917 304.476,565.985 379.298,565.985'

console.log(s.replaceAll(/[\d.]+/g, m=>+m+100))

Javascript相关问答推荐

如何通过在提交时工作的函数显示dom元素?

如何在不分配整个数组的情况下修改包含数组的行为主体?

react 路由加载程序行为

React存档iframe点击行为

自定义高图中的x轴标签序列

如何从html元素创建树 struct ?

使用LocaleCompare()进行排序时,首先使用大写字母

在open shadow—root中匹配时,使用jQuery删除一个封闭的div类

VUE 3捕获错误并呈现另一个组件

当使用';字母而不是与';var#39;一起使用时,访问窗口为什么返回未定义的?

类构造函数不能在没有用With Router包装的情况下调用

使用类型:assets资源 /资源&时,webpack的配置对象&无效

Node.js错误: node 不可单击或不是元素

判断函数参数的类型

在Java脚本中录制视频后看不到曲目

postman 预请求中的hmac/sha256内标识-从js示例转换

JWT Cookie安全性

我的NavLink活动类在REACT-ROUTER-V6中出现问题

如何将对象推送到firestore数组?

Oracle APEX-如何调用Java脚本函数