我无法在我的js文件中放置两个或多个svg形状,并将它们显示在我的网站上

当我在网络浏览器中打开html页面时,我只能看到此列表中的第一个形状,而其他形状则没有它们的代码显示。 我在两个单独的文件(一个html文件和一个js文件)中编写了代码。 任何人都可以告诉我,如果我的代码中缺少某些导致该问题发生的内容。 我的html文件中的代码:       `                     让我们面对D3.js              

  </head>
  <body>
  <svg width="1000" height="500"></svg>

  <script src="bundle.js">
  </script>

  </body>
  </html>`

我的js文件中的代码:

`(function () {
'use strict';

const svg = d3.select('svg');
svg.style('background-color','red');
const height = parseFloat(svg.attr('height'));
const width= +svg.attr('width');

const circle = svg.append('circle');
circle.attr('r',height / 2);
circle.attr('cx',width/2);
circle.attr('cy',height/2);
circle.attr('fill','#FFFFFF');
circle.attr('stroke','green');

const leftEye = svg.append('rect');
rect.attr('x',width/2);
rect.attr('y',height/2);
rect.attr('fill','#000000');
rect.attr('stroke','green');

const rightEye = svg.append('circle');
circle.attr('r',30);
circle.attr('cx',600);
circle.attr('cy','green');`
jyws8 回答:我无法在我的js文件中放置两个或多个svg形状,并将它们显示在我的网站上

您在哪里:

rect.attr('x',width/2);

您对'rect'中的字符串svg.append('rect')感到困惑。您不应将此svg引用为rect。相反,您已将其设置为常量并将其命名为leftEye,因此应将其引用为leftEye

leftEye.attr('x',width/2);

rightEye变量也是如此。

本文链接:https://www.f2er.com/3136765.html

大家都在问