Sup guys. I've managed to get my code to do what I want perfectly with the const Lines
. My main problem is that I'm trying to get the stroke
value that matches the right points
value. As you can tell my script parses the SVG from that URL and sends each points
value with a post request. Is there anyway I could grab the matching stroke
value when it get's the points
value? Than use that with the request just like the l: (JSON.stringify(line))
? So it will send the line
with the matching stroke
value in the request?? The Stroke
value has to be in HEX format when it sends the request just like it displays in the stroke: EXAMPLE #30f011
.
Also possibly be able to do the other attributes like this eventually? If needed let's say the stroke-Width
?
In my script you can see in the request where I've added stroke
This formats the hex code weird and only gets the first stroke
value and no more after that. It stays the same??
xhr=new XMLHttpRequest();
xhr.open("GET", "http://colorillo.com/bwf7.inline.svg");
xhr.addEventListener("load", function() {
const xmlDoc = new DOMParser().parseFromString(
this.responseText.trim(),
"image/svg+xml"
);
const Lines = Array.from(xmlDoc.getElementsByTagName('polyline'), pl =>
pl.getAttribute('points').split(' ').map(pair =>
pair.split(',').map(Number)));
const styles = Array.from(xmlDoc.getElementsByTagName('polyline'), pl =>
pl.getAttribute('style').split(';'))[0];
let stroke = null;
for(let style of styles) {
let valueOffset = style.indexOf(':');
if(style.substr(0, valueOffset).trim() === 'stroke') {
stroke = style.substr(valueOffset + 1).trim()
break;
}
}
Lines.forEach(line => $.post("/draw.php?ing=_index", {
l: (JSON.stringify(line)),
w: ("1"),
c: (stroke), //Only seems to get the first HEX value of line. and that's it.... I need all for each matching ``line``
o: ("75"),
f: ("1"),
_: ("false")
}));
});
xhr.send();
来源:https://stackoverflow.com/questions/56874363/trying-to-parse-two-svg-attributes-at-the-same-time