Question

所有

例如，我有一个字符串数组：

["string1","string2","string3","string4","string5"]

我想将所有这些添加到div中，并将它们分开：

<div>
string1<br>
string2<br>
string3<br>
string4<br>
string5
</div>

我想知道如何用D3做到这一点？我在想使用selectAll（）... data（）... enter（）。append（），但我不知道如何追加它。

由于

Answer 1

d3中的数据绑定是关于将元素附加到数据中每个项目的dom。但是，您要求的是如何将一个元素与我的字符串分隔为<br/>：

  var arr = ["string1","string2","string3","string4","string5"];
  d3.select('body')
    .append('div')
    .html(arr.join('<br/>'));

获得相同外观的更多d3方法是（但这会为每个字符串提供一个div）：

  var arr = ["string1","string2","string3","string4","string5"];

  d3.select('body')
    .selectAll('div')
    .data(arr)
    .enter()
    .append('div')
    .text(function(d){
      return d;
    });

第三种方法是使用<span> s：

d3.select('body')
    .selectAll('span')
    .data(arr)
    .enter()
    .append('span')
    .text(function(d){
      return d;
    })
    .append('br');

这里有example两种方法。

Answer 2

你应该将孩子附加到div;

尝试这样的事情（这是纯粹的js !!!）：

library(shiny)


shinyUI(fluidPage(
  title = 'Examples of DataTables',
  sidebarLayout(

    sidebarPanel(
      wellPanel(
        numericInput('crlevel', "Q-ty of criterion levels",2)
      ),
            textOutput("text1"),
           conditionalPanel(
        "input.tabPanel === 'Tab 2'",
      helpText('helptext - Test1'),
      numericInput ("level","Test2. Q-ty of Criterion levels:", 3)
        )  
    ),

    mainPanel(
      uiOutput("mytabs")
    )
  )
))




library(shiny)

 shinyServer(function(input, output,session) {

output$text1 <- renderText({
    paste("The value of input$crlevel is: ", input$crlevel
    )
  })
  output$mytabs <- renderUI({
      do.call(tabsetPanel, lapply(1:(input$crlevel+2), function(x){      
      if (x == 1) {tabPanel("options", textOutput("options"))
      }else {
      tabPanel(paste('Tab', x), uiOutput('Tab', x))
      }
    })
    )
  })  
output$options <- renderText({
  paste("Hello world! "
  )
})
})

https://jsfiddle.net/maio/m3sqjjb3/

如何将文本附加到D3中的div

2 个答案: