sankey diagram with rCharts into shiny application. Color issue

问题

I am using rCharts to create a Sankey plot

library(networkD3)
library(rCharts)
source1 = c('Proizvodnja okroglega lesa', 'Uvoz okroglega lesa', 'Poraba okroglega lesa', 'Poraba okroglega lesa',
            'Zage','Zage','Zage', 'Zagan les','Uvoz zaganega lesa','Zagan les','Stanje','Stanje')
target1=c('Poraba okroglega lesa','Poraba okroglega lesa', 'Izvoz okroglega lesa', 'Zage', 'Celuloza in plosce',
          'Energetska raba','Zagan les', 'Lesni ostanki','Stanje','Stanje',
          'Poraba zaganega lesa v Sloveniji', 'Izvoz zaganega lesa')
value1 = c(2.765, 0.152, 1.372, 1.545, 0.340, 0.205, 1,0.350, 0.814, 0.650, 0.521, 0.943)

links=data.frame(source1, target1, value1)
colnames(links) <- c("source", "target", "value")

links$source <- sapply(links$source, FUN = function(x) {return(as.character(nodes[x+1]))}) #x+1 since js starts at 0
links$target <- sapply(links$target, FUN = function(x) {return(nodes[x+1])}) #x+1 since js starts at 0
sankeyPlot <- rCharts$new()
sankeyPlot$setLib('http://timelyportfolio.github.io/rCharts_d3_sankey')
sankeyPlot$set(
  data = links,
  nodeWidth = 30,
  nodePadding = 80,
  layout = 100,
  width = 900,
  height = 500,
  units = "TWh",
  NodeGroup = links$group,
  title = "Sankey Diagram",
  fontSize = 1, 
  opacity = 0.9
)

sankeyPlot$setTemplate(
  afterScript = "
  <script>
  var cscale = d3.scale.category20b();

  // to be specific in case you have more than one chart
  d3.selectAll('#{{ chartId }} svg path.link')
  .style('stroke', function(d){
  //here we will use the source color
  //if you want target then sub target for source
  //or if you want something other than gray
  //supply a constant
  //or use a categorical scale or gradient
  //return d.source.color;
  return cscale(d.source.name);
  })
  //note no changes were made to opacity
  //to do uncomment below but will affect mouseover
  //so will need to define mouseover and mouseout
  //happy to show how to do this also
  // .style('stroke-opacity', .7)
  d3.selectAll('#{{ chartId }} svg .node rect')
  .style('fill', function(d){
  return cscale(d.name)
  })
  .style('stroke', 'none')
  </script>
  ")
sankeyPlot

Now, I would like to use the same plot to create a shiny application. This code should do the trick:

require(shiny)
runApp(list(
  ui = pageWithSidebar(
    headerPanel('Test'),
    sidebarPanel(  'Test'  ),
    mainPanel(
      chartOutput("Plot", 'C:/Users/JernejJ/Documents/R/win-library/3.2/rCharts/widgets/d3_sankey')  
    )
  ),
  server = function(input, output, session){

    source1 = c('Proizvodnja okroglega lesa', 'Uvoz okroglega lesa', 'Poraba okroglega lesa', 'Poraba okroglega lesa',
                'Zage','Zage','Zage', 'Zagan les','Uvoz zaganega lesa','Zagan les','Stanje','Stanje')
    target1=c('Poraba okroglega lesa','Poraba okroglega lesa', 'Izvoz okroglega lesa', 'Zage', 'Celuloza in plosce',
              'Energetska raba','Zagan les', 'Lesni ostanki','Stanje','Stanje',
              'Poraba zaganega lesa v Sloveniji', 'Izvoz zaganega lesa')
    value1 = c(2.765, 0.152, 1.372, 1.545, 0.340, 0.205, 1,0.350, 0.814, 0.650, 0.521, 0.943)
    group = c(1,1,1,1,1,1,1,1,1,1,1,1)

    links=data.frame(source1, target1, value1, group)
    colnames(links) <- c("source", "target", "value", 'group')
    output$Plot <-  renderChart2({
      sankeyPlot2 <- rCharts$new()
      sankeyPlot2$setLib('C:/Users/JernejJ/Documents/R/win-library/3.2/rCharts/widgets/d3_sankey')
      sankeyPlot2$set(
        data = links,
        nodeWidth = 50,
        nodePadding = 80,
        layout = 100,
        width = 960,
        height = 500,
        units = "TWh",
        title = "Sankey Diagram"
      )
      sankeyPlot2$setTemplate(
        afterScript = "
  <script>
  var cscale = d3.scale.category20b();

  // to be specific in case you have more than one chart
  d3.selectAll('#{{ chartId }} svg path.link')
  .style('stroke', function(d){
  //here we will use the source color
  //if you want target then sub target for source
  //or if you want something other than gray
  //supply a constant
  //or use a categorical scale or gradient
  //return d.source.color;
  return cscale(d.source.name);
  })
  //note no changes were made to opacity
  //to do uncomment below but will affect mouseover
  //so will need to define mouseover and mouseout
  //happy to show how to do this also
  // .style('stroke-opacity', .7)
  d3.selectAll('#{{ chartId }} svg .node rect')
  .style('fill', function(d){
  return cscale(d.name)
  })
  .style('stroke', 'none')
  </script>
  ")
      sankeyPlot2
    })
  }
))

Everything is OK, but colors defined in after script do not change. Where is the problem?

Bellow is PrtScr of my current sankey application. Why do I get this strange letters d..ž?

来源：https://stackoverflow.com/questions/41089245/sankey-diagram-with-rcharts-into-shiny-application-color-issue