如何减小 rnvd3 中工具提示的字体大小？答案

【问题标题】：How to reduce the font size of a tooltip in rnvd3?如何减小 rnvd3 中工具提示的字体大小？
【发布时间】：2016-09-13 02:10:22
【问题描述】：

我正在使用 rnvd3 包在 Shiny App 中绘制交互式多条形图，图表的工具提示字体很大，我想缩小它。

这是我的代码：

library(shiny)
library(rCharts)
library(shinythemes)
library(shinydashboard)

ui <- navbarPage(title = "Information", 

             tabPanel(title = "Graph",  

                               fluidRow(
                                 column(2),
                                 column(8,
                                        tags$br(),
                                        tags$h5("Chart", style="font-weight: bold; font-size:20px", align = "center"),
                                        tags$br())
                               ),

                              fluidRow(
                                column(1),
                                column(8,
                                       tags$br(),
                                       tags$h5("Exemple", style="font-weight: bold; font-size:14px", align = "center"),
                                       tags$br(),
                                       showOutput("bar","nvd3")), 
                                column(1)
                              )


             )
)

server <- function(input,output, session) { 

output$bar <- renderChart2({

  database2 <- cbind(cbind(c(100,110,140),c("2016-09-05","2016-09-05","2016-09-05")),c("Product A","Product B","Product C"))
  database2[,1] <- as.numeric(database2[,1]) 
  database2[,2] <- as.Date(database2[,2],origin="1899-12-30")
  colnames(database2) <- c("Price","Date","Key")
  database2 <- as.data.frame(database2)

  m1net_eb <- nPlot(Price ~ Date, group = 'Key', data = database2, type='multiBarChart')
  m1net_eb$chart(margin = list(left=60,bottom=110,right=60))
  m1net_eb$chart(forceY = 0)
  m1net_eb$set(lineWidth = 1, width=1100 , height = 700)
  m1net_eb

})

}

shinyApp(ui=ui, server=server)

如何减小此包装中工具提示的字体大小？请帮忙

【问题讨论】：

很可能你可以用 CSS 来改变它。请提供一个可重现的例子。
您好.. 我已经用可重现的代码编辑了我的问题。在这个例子中，我想减小图例“产品 A”、“产品 B”、“产品 C”的工具提示的字体大小

标签： r shiny tooltip nvd3.js rcharts

【解决方案1】：

只需添加

                          tags$head(tags$style(HTML("
                                           .nvtooltip h3 {
                                              font-size:14px;
                                           }
                                           ")))

这是完整的代码。

library(shiny)
library(rCharts)
library(shinythemes)
library(shinydashboard)

ui <- navbarPage(title = "Information", 
                 tabPanel(title = "Graph",  

                          fluidRow(
                            column(2),
                            column(8,
                                   tags$br(),
                                   tags$h5("Chart", style="font-weight: bold; font-size:20px", align = "center"),
                                   tags$br())
                          ),

                          fluidRow(
                            column(1),
                            column(8,
                                   tags$br(),
                                   tags$h5("Exemple", style="font-weight: bold; font-size:14px", align = "center"),
                                   tags$br(),
                                   showOutput("bar","nvd3")), 
                            column(1)
                          ),

                          tags$head(tags$style(HTML("
                                           .nvtooltip h3 {
                                              font-size:14px;
                                           }
                                           ")))


                 )
)

server <- function(input,output, session) { 

  output$bar <- renderChart2({

    database2 <- cbind(cbind(c(100,110,140),c("2016-09-05","2016-09-05","2016-09-05")),c("Product A","Product B","Product C"))
    database2[,1] <- as.numeric(database2[,1]) 
    database2[,2] <- as.Date(database2[,2],origin="1899-12-30")
    colnames(database2) <- c("Price","Date","Key")
    database2 <- as.data.frame(database2)

    m1net_eb <- nPlot(Price ~ Date, group = 'Key', data = database2, type='multiBarChart')
    m1net_eb$chart(margin = list(left=60,bottom=110,right=60))
    m1net_eb$chart(forceY = 0)
    m1net_eb$set(lineWidth = 1, width=1100 , height = 700)
    m1net_eb

  })

}

shinyApp(ui=ui, server=server)

【讨论】：