Выделите окружность с помощью D3.js

-2

Как выделить окружность круга в d3.js, когда пользователь навешивает над ним? Я хотел бы Болден ширину окружности, когда пользователь парит над той жеВыделите окружность с помощью D3.js

источник

2016-11-19 sjaikumar

Вы ищете что-то вроде этого:

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="4.0.0" src="https://d3js.org/d3.v4.min.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <script> 
 
     
 
     var svg = d3.select('body') 
 
     .append('svg') 
 
     .attr('width', 500) 
 
     .attr('height', 500); 
 
     
 
     var circle = svg.append('circle') 
 
     .attr('transform', 'translate(250,250)') 
 
     .attr('r', 200) 
 
     .style('fill', 'steelblue') 
 
     .style('stroke-width', '15px') 
 
     .style('stroke', 'none') 
 
     .on('mouseover', function(){ 
 
      d3.select(this) 
 
      .style('stroke', 'orange'); 
 
     }) 
 
     .on('mouseover', function(){ 
 
      circle 
 
      .style('stroke', 'orange'); 
 
     }) 
 
     .on('mouseout', function(){ 
 
      circle 
 
      .style('stroke', 'none'); 
 
     }) 
 
     
 
    </script> 
 
    </body> 
 

 
</html>

источник

2016-11-20 00:36:43 Mark

Спасибо, Марк. Это оказало огромную помощь. Я смог его реализовать. – sjaikumar

Вы можете сделать это с помощью простого CSS, нет необходимости использовать D3.js. Пример:

circle { 
 
    fill: lightblue; 
 
    stroke: grey; 
 
    stroke-width: 0; 
 
} 
 

 
circle:hover { 
 
    stroke-width: 2px; 
 
}

<svg height="100" width="100"> 
 
    <circle cx="50" cy="50" r="40"/> 
 
</svg>

источник

2016-11-20 00:36:02

Спасибо за вашу помощь Оскара! – sjaikumar

Выделите окружность с помощью D3.js

ответ

Смежные вопросы