2016-07-04 35 views
0

我需要在一個閃亮的應用程序(highcharter,rcharts,其他)上使用R的任何highcharts包將圖例添加到餅圖中。使用highcharter或Rcharts在餅圖中添加圖例

Ex。代碼

library("shiny") 
library("highcharter") 

data(citytemp) 

ui <- fluidPage(
    h1("Highcharter Demo"), 
    fluidRow(
    column(width = 4, class = "panel", 
      selectInput("type", label = "Type", width = "100%", 
         choices = c("line", "column", "bar", "spline")), 
      selectInput("stacked", label = "Stacked", width = "100%", 
         choices = c(FALSE, "normal", "percent")), 
      selectInput("theme", label = "Theme", width = "100%", 
         choices = c(FALSE, "fivethirtyeight", "economist", 
            "darkunica", "gridlight", "sandsignika", 
            "null", "handdrwran", "chalk") 
      ) 
    ), 
    column(width = 8, 
      highchartOutput("hcontainer",height = "500px") 
    ) 
) 
) 

server = function(input, output) { 

    output$hcontainer <- renderHighchart({ 

    hc <- hc_demo() %>% 
     hc_rm_series("Berlin") %>% 
     hc_chart(type = 'pie') 

    if (input$stacked != FALSE) { 
     hc <- hc %>% 
     hc_plotOptions(showInLegend=TRUE,dataLabels=FALSE) 
    } 
    hc 

    }) 

} 

shinyApp(ui = ui, server = server) 

的代碼運行一個餅圖的一個蹩腳的例子,無論身在何處我看我能不能找到一個傳說highcharts餅圖的一個例子。

試圖修復它包括:

hc_legend(啓用= TRUE)< - 不工作,不做任何改變。

hc_plotOptions(showInLegend = TRUE,dataLabels = FALSE)< - 同樣,沒有變化

使用類似的嘗試Rcharts,他們都失敗了,我則成了徹底迷路了翻翻的highcharts

源代碼

使用類似的功能我能夠通過使用上述兩種解決方案中的任何一種創建具有典型JS格式的圖例的高圖餅圖,是否有人對此問題有合理的解決方案?可能是指出一個體面的資源鏈接?

實際的JS與傳說中的highcharts的例子,無恥地從官方highcharts網站撕下。

$(function() { 
 

 
    $(document).ready(function() { 
 

 
     // Build the chart 
 
     $('#container').highcharts({ 
 
      chart: { 
 
       plotBackgroundColor: null, 
 
       plotBorderWidth: null, 
 
       plotShadow: false, 
 
       type: 'pie' 
 
      }, 
 
      title: { 
 
       text: 'Browser market shares January, 2015 to May, 2015' 
 
      }, 
 
      tooltip: { 
 
       pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>' 
 
      }, 
 
      plotOptions: { 
 
       pie: { 
 
        allowPointSelect: true, 
 
        cursor: 'pointer', 
 
        showInLegend: true 
 
       } 
 
      }, 
 
      series: [{ 
 
       name: 'Brands', 
 
       colorByPoint: true, 
 
       data: [{ 
 
        name: 'Microsoft Internet Explorer', 
 
        y: 56.33 
 
       }, { 
 
        name: 'Chrome', 
 
        y: 24.03, 
 
        sliced: true, 
 
        selected: true 
 
       }, { 
 
        name: 'Firefox', 
 
        y: 10.38 
 
       }, { 
 
        name: 'Safari', 
 
        y: 4.77 
 
       }, { 
 
        name: 'Opera', 
 
        y: 0.91 
 
       }, { 
 
        name: 'Proprietary or Undetectable', 
 
        y: 0.2 
 
       }] 
 
      }] 
 
     }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.highcharts.com/highcharts.js"></script> 
 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 
 

 
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

+0

您可以嘗試準備自己的HTML圖例,如下所示:http://jsfiddle.net/N3KAC/1/ –

+0

@SebastianBochan我會讓你知道它是怎麼回事。我可能能夠將其納入R或閃亮。 – Edge363

+0

對不起,我不熟悉R寶石等;) –

回答

4

首先,在您的示例hc_demo()是線圖的例子,所以不會僅通過改變圖表的類型,由於數據不編碼以及工作一個餅圖(yname值)需要。

這裏是一個原始的例子。正如您在javascript示例中所展示的那樣,您只需強制顯示圖例,因爲對於餅圖,默認值爲false。這是通過使用plotOptions - > pie - > showInLegend = TRUE來實現的。

library(highcharter) 
highchart() %>% 
    hc_chart(type = "pie") %>% 
    hc_plotOptions(
    series = list(showInLegend = TRUE) 
) %>% 
    hc_add_series(data = list(
    list(y = 3, name = "cat 1"), 
    list(y = 4, name = "cat 2") 
    ) 
) 

最後,我建議你檢查replicating highcharts demos in highcharter

+1

不錯,簡潔的例子。 – Uwe

+0

謝謝。對不起,我的語法錯誤。 – jbkunst