Warm tip: This article is reproduced from stackoverflow.com, please click
javascript jquery

Can't find a way to send post request

发布于 2020-03-27 10:22:38

So my problem is that I'm tying to get the stroke values to send as a post request just like my script currently does the pointsattribute values in the post request... l: (JSON.stringify(line)) << Just like that in the post request but I need it to do the stroke values. So if it's possible to use something like c: (JSON.stringify(stroke))

I want to match the lines with their stroke colors and send the request with the color just like the line.

The stroke value is inside the style attribute of that SVG. Here's a image showing exactly what I need to log just like it does the points.

enter image description here

So yeah, simply parse and send it like it does the points values..

I've tried making a const just like the LINES but no luck.

xhr=new XMLHttpRequest();
xhr.open("GET", "http://colorillo.com/blqu.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)));

Lines.forEach(line => $.post("/draw.php?ing=_index", {
                l: (JSON.stringify(line)), 
                w: ("1"),
                c: (JSON.stringify(Stroke)), //<<<< MY ERROR IS HERE!!!
                o: ("75"),
                f: ("1"),
                _: ("false")
            }));
});
xhr.send();
Questioner
愛雨iⱣines
Viewed
92
Minding 2019-07-04 07:39

Here you go, just search the array for 'stroke' like this:

DEMO

xhr = new XMLHttpRequest();
xhr.open("GET", "http://colorillo.com/blqu.inline.svg");
xhr.addEventListener("load", function() {
    const xmlDoc = new DOMParser().parseFromString(
        this.responseText.trim(),
        "image/svg+xml"
    );
    let output = [];
    // Get all polylines as strings
    let lines = xmlDoc.getElementsByTagName('polyline');
    // Loop over all lines
    for(let line of lines) {
        //Define more vars here...
        //Often times you can just use something like below and don't need to put it in the loop.
        let stroke = null; //See Bruce'es comment (rgb() as output): line.style.stroke;
        let opacity = line.style.opacity;
        let strokeWidth = line.style.strokeWidth;

        // Loop over all styles of this line (output same as input [hex])
        for(let style of line.getAttribute('style').split(';')) {
            // Get name & value
            let valueOffset = style.indexOf(':');
            // Check if name equal to 'stroke'
            let value = style.substr(valueOffset + 1).trim()
            switch(style.substr(0, valueOffset).trim()) {
                case 'stroke':
                    // Save stroke value
                    stroke = value;
                    // Break out of the loop (we don't have to search further)
                    break;
            }
        }
        output.push({
            l: (JSON.stringify(line.getAttribute('points').split(' ').map(pair => pair.split(',').map(Number)))),
            w: (strokeWidth),
            c: (stroke),
            o: (opacity),
            f: ("1"),
            _: ("false")
        });
    }
    $.post("/draw.php?ing=_index", output);
});
xhr.send();

Hope this helps. -Minding