Skip to content

[Bug]: tooltip class conflicts when use with Bootstrap #7153

@DivadNojnarg

Description

@DivadNojnarg

Describe the bug / 问题描述

Tooltip generated with the tooltip plugin have the .tooltip class which collides with the Bootstrap tooltip API. Is there a way to workaround this?

To provide more context, I am developing R bindings to your JS G6 library so people can use it in their Quarto or Shiny applications: https://cynkra.github.io/g6R/articles/g6R.html. Unfortunately, the Shiny R package heavily relies on Bootstrap for application layout, and tooltip don't show in that specific context.

I've seen that in the antvis/conponent library one can add prefixes to the class, but I don't find any exposed parameter in the G6 tooltip plugin.

Is there a way to workaround this?

Reproduction link / 复现链接

No response

Steps to Reproduce the Bug or Issue / 重现步骤

This can only be reproduced from an R environment:

Installation

You can install the development version of {g6R} from GitHub with:

# install.packages("pak")
pak::pak("cynkra/g6R")

Example

To create a g6 graph inside a Shiny app context with Bootstrap 5.3 where tooltip don't work:

library(shiny)
library(bslib)
library(g6R)

nodes <- data.frame(
  id = as.character(1:10),
  label = as.character(1:10)
)

# Generate random edges
edges <- data.frame(
  source = c("2", "6", "7"),
  target = c("1", "3", "9")
)

ui <- page_fluid(
  g6_output("graph")
)

server <- function(input, output, session) {
  output$graph <- render_g6({
    g6(nodes, edges) |>
      g6_layout(d3_force_layout()) |>
      g6_plugins(
        "minimap",
        "tooltip"
      )
  })
}

shinyApp(ui, server)

In the isolate graph (outside Shiny and without Bootstrap) no problem:

g6(nodes, edges) |>
      g6_layout(d3_force_layout()) |>
      g6_plugins(
        "minimap",
        "tooltip"
      )

Version / 版本

🆕 5.x

OS / 操作系统

  • macOS
  • Windows
  • Linux
  • Others / 其他

Browser / 浏览器

  • Chrome
  • Edge
  • Firefox
  • Safari (Limited support / 有限支持)
  • IE (Nonsupport / 不支持)
  • Others / 其他

Metadata

Metadata

Assignees

No one assigned

    Labels

    feature 💡A new feature request or an enhancement proposal

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions