Skip to content

Release v2.5

Latest

Choose a tag to compare

@Stukova Stukova released this 11 Sep 14:45

πŸŽ‰ What's New

Link Hover Detection

Screen.Recording.2025-09-11.at.07.43.07.web.mp4
const config = {
  hoveredLinkColor: '#ff3333',
  hoveredLinkWidthIncrease: 4,
  hoveredLinkCursor: 'pointer',
  
  onLinkMouseOver: (linkIndex) => {
    console.log(`Hovering over link ${linkIndex}`);
  },
  
  onLinkMouseOut: (event) => {
    console.log('Mouse left link');
  },
  
  onLinkClick: (linkIndex, event) => {
    console.log(`Clicked link ${linkIndex}`);
  }
};

Link Hover Configuration Options

Fine-tune the link hover experience with new configuration properties:

  • hoveredLinkColor - Color for hovered links (hex string or RGBA array)
  • hoveredLinkWidthIncrease - Additional pixels to add to link width on hover (default: 5)
  • hoveredLinkCursor - Cursor style when hovering over links (default: 'auto')

New Mouse Event Callbacks

Added comprehensive mouse event handling for enhanced interactivity:

  • onLinkMouseOver(linkIndex) - Called when mouse enters a link
  • onLinkMouseOut(event) - Called when mouse leaves a link
  • onLinkClick(linkIndex, event) - Called when a link is clicked
  • onPointClick(index, position, event) - Called when a point is clicked
  • onBackgroundClick(event) - Called when clicking empty space

Enhanced API with unpause() Method

Added a new unpause() method to replace the deprecated restart() method and onSimulationUnpause config option added instead of onSimulationRestart.

// New recommended approach
graph.unpause();

// Deprecated (still works but will be removed)
graph.restart();

Check out the new Link Hovering story in the documentation for a complete working example!