Skip to content

Commit f9faeea

Browse files
authored
Created: README.md
1 parent d842a11 commit f9faeea

1 file changed

Lines changed: 54 additions & 0 deletions

File tree

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
# SVG Path Data Parser
2+
[Edabit Problem](https://edabit.com/challenge/ysMrKPGby3FXiYtQn)
3+
4+
A `<path>` element can usually be found inside an `<svg>` element and has an attribute **d** that represents the definition of the outline of a shape.
5+
6+
A brief summary about this attribute:
7+
8+
It contains commands (letters) and coordinates (numbers)
9+
All instructions are expressed as one character (e.g., a moveto is expressed as an **M**).
10+
Superfluous white space and separators such as commas can be eliminated (e.g., M 10 10 L 20 20 contains unnecessary spaces and could be expressed more compactly as `M10 10L20 20`).
11+
The command letter can be eliminated on subsequent commands if the same command is used multiple times in a row (e.g., you can drop the second L in `M 10 20 L 20 10 L -10 -20` and use `M 10 20 L 20 10 -10 -20` instead).
12+
13+
Your job is to build a parser that will convert this string in an array of commands, where each array element is an object with the `command` letter and an array of `parameters`.
14+
15+
This summary is incomplete but should get you started, for more information please refer to the W3C specification found in the resources tab.
16+
17+
## Examples
18+
19+
```javascript
20+
pathDataParser("") ➞ []
21+
22+
pathDataParser("M 0 0") ➞ [{command: 'M', parameters: [0, 0]}]
23+
24+
pathDataParser("M 1 1.5 L 0 1.5 0 0.5 1 0.5 0.5 0 0 0.5 1 1.5 1 0.5 0 1.5" ➞ [
25+
{command: "M", parameters: [1, 1.5]},
26+
{command: "L", parameters: [0, 1.5, 0, 0.5, 1, 0.5, 0.5, 0, 0, 0.5, 1, 1.5, 1, 0.5, 0, 1.5]}
27+
]
28+
29+
pathDataParser("M 0,1 h 1 v -1 h 1 v 1 h 1 C 2,1 3,3 1.5,3 C 0,3 1,1 0,1 z" ➞ [
30+
{command: "M", parameters: [0, 1]},
31+
{command: "h", parameters: [1]},
32+
{command: "v", parameters: [-1]},
33+
{command: "h", parameters: [1]},
34+
{command: "v", parameters: [1]},
35+
{command: "h", parameters: [1]},
36+
{command: "C", parameters: [2, 1, 3, 3, 1.5, 3]},
37+
{command: "C", parameters: [0, 3, 1, 1, 0, 1]},
38+
{command: "z", parameters: []}
39+
]
40+
```
41+
42+
## Notes:
43+
44+
- Return an empty array if no commands are found (example #1)
45+
- The z (or Z) command is the only one without parameters, in this case return an empty array (see last command of example #4)
46+
- The parameters array contains numbers, not strings, so you'll have to convert them
47+
- Sometimes numbers can be very compressed to save space, let's look at some examples that might trip you up:
48+
- Decimal numbers can start with a dot: .4 is the same as 0.4
49+
- If a negative number comes after another number, the space is optional: 0-4 is equal to 0 -4
50+
- Multiple decimal numbers in a row can be very tricky, remember that a number CAN NOT have more than 1 dot, so this: 1.2.34 is actually 2 different numbers: 1.2 and 0.34
51+
- Some examples have commas, some do not, some have multiline strings, some are a single line, remember to take into account all valid cases! Check out the tests tab to find out more.
52+
53+
## By: arindal1
54+
***[GitHub](https://github.com/arindal1)***

0 commit comments

Comments
 (0)