svg rect to polygon points & points order bug

https://codepen.io/xgqfrms/pen/vYOWjYr?editors=1000

points 数据类型转换 bug, string + string !== number + number

https://codepen.io/xgqfrms/pen/vYOWjYr?editors=1000

error

  const x = rect.getAttribute('x');
const y = rect.getAttribute('y');
const width = rect.getAttribute('width');
const height = rect.getAttribute('height');
const points = [];
points.push(pointGenerator(x, y));
points.push(pointGenerator((x + width), y));
points.push(pointGenerator((x + width), (y + height)));
points.push(pointGenerator(x, (y + height)));

OK

  const x = +rect.getAttribute('x');
const y = +rect.getAttribute('y');
const width = +rect.getAttribute('width');
const height = +rect.getAttribute('height');
const points = [];
points.push(pointGenerator(x, y));
points.push(pointGenerator((x + width), y));
points.push(pointGenerator((x + width), (y + height)));
points.push(pointGenerator(x, (y + height)));

object map to array, order change bug

bug


const pointGenerator = (x, y) => {
// return [
// x,
// y,
// ];
return {
x,
y,
};
} // const points_str = points.flat(2).join(` `);
const points_str = points.map(({x, y}) => [x, y]).flat(2).join(` `);

ok



const pointGenerator = (x, y) => {
return [
x,
y,
];
// return {
// x,
// y,
// };
} const points_str = points.flat(2).join(` `);
// const points_str = points.map(({x, y}) => [x, y]).flat(2).join(` `);

svg rect to polygon points & points order bug的更多相关文章

  1. how to convert SVG shapes to polygon

    how to convert SVG shapes to polygon 如何将 svg 的 rect 转换成 polygon rect.circle.ellipse.line.polyline.po ...

  2. [javascript svg fill stroke stroke-width points polygon属性讲解] svg fill stroke stroke-width points polygon绘制多边形属性并且演示polyline和polygon区别讲解

    <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...

  3. how to change svg polygon size by update it's points in js

    how to change svg polygon size by update it's points in js matrixTransform https://stackoverflow.com ...

  4. [javascript svg fill stroke stroke-width points polyline 属性讲解] svg fill stroke stroke-width points polyline 绘制折线属性讲解

    <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...

  5. svg insert shape string bug

    svg insert shape string bug not support custom areaProps attributes ??? const svg = document.querySe ...

  6. [POJ 3788] Interior Points of Lattice Polygons

    同swustoj 169 Interior Points of Lattice Polygons Time Limit: 1000MS   Memory Limit: 65536K Total Sub ...

  7. [Swift]LeetCode973. 最接近原点的 K 个点 | K Closest Points to Origin

    We have a list of points on the plane.  Find the K closest points to the origin (0, 0). (Here, the d ...

  8. SGU 403 Game with points

    408. Game with points Time limit per test: 0.25 second(s)Memory limit: 65536 kilobytes input: standa ...

  9. 【leetcode】Max Points on a Line

    Max Points on a Line 题目描述: Given n points on a 2D plane, find the maximum number of points that lie ...

随机推荐

  1. list中map 的value值时间排序

    public static void main(String[] args) { String sys=DateUtil.getTime().substring(0,5); System.out.pr ...

  2. Centos 7 安装 erlang

    https://www.cnblogs.com/swyy/p/11582309.html https://blog.csdn.net/qq_20492999/article/details/81254 ...

  3. python3编码转换

    str->bytes:encode编码 bytes->str:decode解码 字符串通过编码成为字节码,字节码通过解码成为字符串. >>> text = '我是文本' ...

  4. OAuth2.0与前端无感知token刷新实现

    前言 OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛的应用.Facebook.Twitter和Google等各种在线服务都提供了基于OAuth规范的认证机制. ...

  5. 前端api管理工具YApi

    使用YApi接口管理工具,提升前端开发效率前端开发苦恼: 代码中使用json数据模拟后端api数据,注释调取api接口代码,代码乱七八糟 为了测试不同case,央求后端人员返回不同的数据,返回状态.返 ...

  6. Linux下统计CPU核心数量

    首先第一步,cat /proc/cpuinfo processor : 0 vendor_id : GenuineIntel cpu family : 6 model : 45 model name ...

  7. vim快捷键收藏版

    总述 附加一篇介绍文哈,关于vim快捷键的介绍.vim和vscode 到底谁更好用,大家争得不可开交,然后我就在vscode里面装了一个vim插件,完美得解决了这个问题,用完之后觉得真香,所以我就整理 ...

  8. 黑客整人代码,vbS整人代码大全(强制自动关机、打开无数计算器、无限循环等)

    vbe与vbs整人代码大全,包括强制自动关机.打开无数计算器.无限循环等vbs整人代码,感兴趣的朋友参考下.vbe与vbs整人代码例子:set s=createobject("wscript ...

  9. Codeforces Round #664 (Div. 2) D. Boboniu Chats with Du

    传送门:cf1395D 题意 给定一个长度为n的数组a[i]为当天说话的有趣值,如果a[i]>m,那么在 i 之后有d天不能说话.否则可以每天都说话.找到一个排列使得n天有趣值总和最大,问有趣值 ...

  10. 【uva 1152】4 Values Whose Sum is Zero(算法效率--中途相遇法+Hash或STL库)

    题意:给定4个N元素几个A,B,C,D,要求分别从中选取一个元素a,b,c,d使得a+b+c+d=0.问有多少种选法.(N≤4000,D≤2^28) 解法:首先我们从最直接最暴力的方法开始思考:四重循 ...