Re: I have contacted two Javascript forums and yet no one can seem to assist me.
Ted Hickox <[email protected]> Sun, 14 Jul 2024 16:29:39 -0500
| Newsgroups | gmane.text.xml.exist |
|---|---|
| Message-ID | <CAAsp6CYPnRN88bdCEF93hambb0wQ8vXBu23SF-xJWYRso5iY3A@mail.gmail.com> |
I thank you very much for your suggestion. But I really don't want to use
PHP at this time. Fortunately StackOverflow finally gave me a good answer
to my question. I will share my code with all of you in case someone needs
this information:
function Setup2() {
var Bezier_Curve_Identification;
var Attribute_Name;
var Attribute_Name_2;
var Coordinate;
var My_Properties;
document.getElementById("My_Text").value = "I'm right here.";
Attribute_Name = "d";
Attribute_Name_2 = "style";
My_Properties = "stroke: blue; stroke-width: 3; fill: none";
Coordinate = "M 300 200 A 20 20 0 0 0 400 200";
Bezier_Curve_Identification = document.getElementById('Bezier_Curve_1');
Bezier_Curve_Identification.setAttribute(Attribute_Name, Coordinate);
Bezier_Curve_Identification.setAttribute(Attribute_Name_2,
My_Properties);
}
Now that I know that I can store my attribute information into variables,
all I have to do is create an XML document, store the information into the
document, validate my XML document, and then use Javascript to retrieve my
information. After that's completed, I can just store the information into
my variables and display my Bezier curve. This will help tremendously with
all future SVG animations. All I would have to do is find the coordinates
I need to change in my XML documents and apply the changes. Or I could
just create an XQuery that could locate and change the coordinates in my
XML documents.
On Sun, Jul 14, 2024 at 2:45 PM dl <[email protected]> wrote:
> By chance I spotted your post when I am not applying eXistdb at this
> moment.
> I can't answer your immediate question using setAttributeNS. So I do not
> post to the forum. But some time back I learned and bookmarked a neat
> trick to use PHP variables to modify SVG attributes - dynamically.
>
> It is documented in old.carto.net.
>
> https://old.carto.net/papers/svg/postgis_geturl_xmlhttprequest/
>
> It involves creating a custom mimetype. Mine is psvg. But otherwise I
> find it useful for customising SVG (and indeed other standard types such
> as css, js). Requires a PHP enabled server to generate custom code from
> the hybrid mimetypes.
>
> This "outlier" approach might not answer your immediate question. But
> I'm sure that it can apply to XHTML code after some experimenting. Refer
> to old.carto.net tutorial.
>
> dl
>
> On 14/07/2024 19:54, Ted Hickox wrote:
> > I really didn't want to contact you, but I felt like I had no other
> > choice. I'm trying to use the setAttributeNS command to change a path
> > arc element inside my XHTML. Once I'm successful in doing this, I
> > will store the arc path coordinates inside the eXist database. Here
> > is my XHTML code:
> >
> > <html xmlns="http://www.w3.org/1999/xhtml">
> > <head>
> > <title>SVG_Bezier_Curve</title>
> > <link rel="stylesheet" type="text/css"
> > href="
> http://localhost:8080/exist/rest/db/apps/HTML_Student/SVG_Bezier_Curve.css
> "/>
> > <script language = "javascript" src =
> > "
> http://localhost:8080/exist/rest/db/apps/HTML_Student/SVG_Bezier_Curve.js
> ">
> >
> > </script>
> > </head>
> > <body>
> > <input type = "text" id = "My_Text" value = "I was
> > here."></input>
> > <input type = "button" onclick = "Setup2()"/>
> > <p id = "My_Paragraph"></p>
> > <svg id = "My_SVG" xmlns="http://www.w3.org/2000/svg"
> > height="500" width="500">
> > <path id = "Bezier_Curve_1"/>
> > <path id="Bezier_Curve_2" d="M 300, 200 A 50, 50 0,0,1
> > 400,200" stroke="red" stroke-width="3" fill="none">
> > </path>
> > </svg>
> > </body>
> > </html>
> >
> > Here is my Javascirpt code:
> >
> > function Setup2() {
> > var SVG_Def;
> > var Bezier_Curve_Identification;
> > var Attribute_Name;
> > var coordinate;
> >
> > document.getElementById("My_Text").value = "I'm right here.";
> > SVG_Def = document.getElementById("My_SVG");
> > Bezier_Curve_Identification = SVG.getElementById('Bezier_Curve_1');
> > Bezier_Curve_Identification.setAttributeNS =
> > ("http://www.w3.org/1999/xlink", "'d'", "'M 300, 200 A 20, 20 0,0,1
> > 340,200'");
> > Bezier_Curve_Identification.setAttributeNS =
> > ("http://www.w3.org/1999/xlink", "'style'", "'stroke: blue;
> > stroke-width: 3; fill: none;'");
> > }
> >
> > I hope you can find the errors so I can finish my project.
> >
> >
> > _______________________________________________
> > Exist-open mailing list
> > [email protected]
> > https://lists.sourceforge.net/lists/listinfo/exist-open
>
>
_______________________________________________
Exist-open mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/exist-open