svg rect to polygon points & points order bug
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的更多相关文章
- how to convert SVG shapes to polygon
how to convert SVG shapes to polygon 如何将 svg 的 rect 转换成 polygon rect.circle.ellipse.line.polyline.po ...
- [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 ...
- 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 ...
- [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 ...
- svg insert shape string bug
svg insert shape string bug not support custom areaProps attributes ??? const svg = document.querySe ...
- [POJ 3788] Interior Points of Lattice Polygons
同swustoj 169 Interior Points of Lattice Polygons Time Limit: 1000MS Memory Limit: 65536K Total Sub ...
- [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 ...
- SGU 403 Game with points
408. Game with points Time limit per test: 0.25 second(s)Memory limit: 65536 kilobytes input: standa ...
- 【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 ...
随机推荐
- MTO1804无刷电机引发的悲惨经历之二:电调固件刷新与优化
前言 原创文章,转载引用请务必注明链接,水平有限,如有疏漏,欢迎指正. 书接上回,我们总算是基本确认了黑衣神秘电调的身份,本文就尝试对电调固件进行一番设置,来个免费优化. 1.刷新固件 关于电调的固件 ...
- 使用 html5 svg 绘制图形
有一次看一个项目的时候,看到图片的格式为svg,作为萌新的我瞬间有点小懵,这可是之前从没有见到过的格式,于是就开始上某度进行学习,发现某博主的优秀文章,进行转载方便自己学习,感谢原博主的优秀文章. · ...
- Hive 使用总结
1 带分区列的表更改列类型 常见的一个场景是Hive里面一个带分区的表,原来是int类型的字段,后来发现数据超过了int的最大值,要改成bigint.或者是bigint要改string或decimal ...
- 34.vsftpd服务程序--虚拟用户模式
1.创建用于进行FTP 认证的用户数据库文件,其中奇数行为账户名,偶数行为密码. [root@localhost ~]# cd /etc/vsftpd/ [root@localhost vsftpd] ...
- ubuntu14.04 ssh允许root用户远程登录
vi /etc/ssh/sshd_config #注释掉 #PermitRootLogin without-password # Authentication: LoginGraceTime 120 ...
- MyBatis框架使用 —— 传递多个参数的方式
引言 目前,MyBatis的使用越来越普遍,也有一些公司使用Hibernate.使用MyBatis需要我们自己书写SQL语句,面对各种复杂的场景,SQL传递多参是很普遍的.如何传递多参应对不同的场景也 ...
- SpringBoot - 实现文件上传1(单文件上传、常用上传参数配置)
Spring Boot 对文件上传做了简化,基本做到了零配置,我们只需要在项目中添加 spring-boot-starter-web 依赖即可. 一.单文件上传 1,代码编写 (1)首先在 stati ...
- linux(3) 处理目录的常用命令
目录命令总览 ls(英文全拼:list files): 列出目录及文件名 cd(英文全拼:change directory):切换目录 pwd(英文全拼:print work directory):显 ...
- AC自动机——看似KMP在跑,其实fail在跳
先存代码 AC自动机(简单版) #include<bits/stdc++.h> #define maxn 1000007 using namespace std; int n,ans; i ...
- poj1821——Fence
题意: 一个栅栏一共有n(从1--n)个木板,我们找k个工人去粉刷它,li表示每个人有限制粉刷木板数量,pi表示粉刷一个木板得到的钱,si表示他开始在那个木板前面 如果一个工人要粉刷,那么他必须粉刷s ...