Bonjour, j'essaie de dessiner un rectangle via JavaScript et DOM.
je crée un élément svg et un élément rect.
j'ai une erreur: TypeError: rect.setAttributeNS is not a function
Et je ne vois pas pourquoi.

Quelqu'un de plus aguerri arrivera peut-être à me mettre sur la voie.

mon
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>TD 2-5-2</title>
    <script type="text/javascript" src="script.js"></script>
</head>
<body id="svgContainer">
 
</body onload="createSvg()">
</html>

mon JS
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
"use strict";
 
//constructeur d'un objet Rectangle
function Rectangle(x,y,largeur,hauteur) {
    this.x = x;
    this.y = y;
    this.largeur = largeur;
    this.hauteur = hauteur;
    this.aire = function() {return this.largeur * this.hauteur};
    this.dessineSVG = function(elmt) {
        var rectangle = document.createElementNS("http://www.w3.org/2000/svg", "rect");
        elmt.appendChild(rectangle);
        //dessineRectangle(rectangle);
        return elmt;
    };
};
 
//génère un rectangle
function dessineRectangle(rect) {
    rect.setAttributeNS(null, "x", rect.x);
    rect.setAttributeNS(null, "y", rect.y);
    rect.setAttributeNS(null, "width", rect.largeur);
    rect.setAttributeNS(null, "height", rect.hauteur);
    rect.setAttributeNS(null, "stroke", "black");
    rect.setAttributeNS(null, "fill", "none");
}
 
//génère des element svg et rectangle et leur taille
window.onload = function createSvg() {
    var svg1 = document.createElementNS("http://www.w3.org/2000/svg", "svg");
    svg1.setAttribute("width", "500");
    svg1.setAttribute("height", "500");
    var rectangle = new Rectangle(30, 20, 100, 40);
    svg1 = rectangle.dessineSVG(svg1);
    document.getElementById("svgContainer").appendChild(svg1);
    dessineRectangle(rectangle);
}
L'erreur: TypeError: rect.setAttributeNS is not a function est à la ligne 20 dans mon JS.

à savoir, ma fonction dessineRectangle() fonctionnait en lui passant un element svg et un tableau avec les valeurs du rectangle en paramètre.
Et mon constructeur Rectangle(x,y,largeur,hauteur) fonctionnait dans un exercice précédent, j'ai juste ajouté la méthode this.dessineSVG.