R 内半径极高

R 内半径极高,r,highcharts,r-highcharter,R,Highcharts,R Highcharter,我正在尝试使用highcharter更改极坐标图的内径,这样我就可以通过像这张很棒的D3图表那样的工具提示来可视化数据 我知道可以像示例中那样使用solid gauge可视化数据,但我希望数据在polar中可见 我尝试过更改innerSize和innerRadius参数,但无法完成 这是我的R代码: library(tidyverse) library(highcharter) highchart() %>% hc_chart(polar = T, type = "bar&

我正在尝试使用
highcharter
更改极坐标图的内径,这样我就可以通过像这张很棒的
D3
图表那样的工具提示来可视化数据

我知道可以像示例中那样使用
solid gauge
可视化数据,但我希望数据在
polar
中可见

我尝试过更改
innerSize
innerRadius
参数,但无法完成

这是我的
R
代码:

library(tidyverse)
library(highcharter)
highchart() %>% 
  hc_chart(polar = T, type = "bar") %>% 
  hc_title(text = "Athlete 1 vs Athlete 2") %>% 
  hc_xAxis(categories = c("Total Score", "Avg. Score", "Sum Score",
                          "Best Score"),
           tickmarkPlacement = "on",
           plotLines = list(
             list(label = list(
               rotation = 90))
             )
           ) %>% 
  hc_yAxis(min = 0) %>% 
  hc_series(
    list(
      name = "Athlete 1",
      data = c(43000, 19000, 60000, 35000)
    ),
    list(
      name = "Athlete 2",
      data = c(50000, 39000, 42000, 31000)
    )
  ) %>% 
  hc_colors(c("firebrick", "steelblue"))

所需的输出类似于:

谢谢大家!


编辑 在@ppotaczek的回答之后,我用他的图表进行了更新,因此所需的更新如下所示:


要在Highcharts极坐标图中获得类似的结果,应将点填充组填充设置为0。为了在图表中间创建一个空的空间,可以使用HygCARTS.SvGrEndReR和<强>偏移< /强> yAx.< /P>
Highcharts.chart('container', {
    chart: {
        polar: true,
        type: 'bar',
        events: {
            render: function() {
                var chart = this,
                    middleElement = chart.middleElement;

                if (middleElement) {
                    middleElement.destroy();
                }

                chart.middleElement = chart.renderer.circle(chart.plotSizeX / 2 + chart.plotLeft, chart.plotHeight / 2 + chart.plotTop, 20).attr({
                    zIndex: 3,
                    fill: '#ffffff'
                }).add();
            }
        }
    },
    yAxis: {
        offset: 20
    },

    series: [{
        pointPadding: 0,
        groupPadding: 0,
        name: "Athlete 1",
        data: [43000, 19000, 60000, 35000]
    }, {
        pointPadding: 0,
        groupPadding: 0,
        name: "Athlete 2",
        data: [50000, 39000, 42000, 31000]
    }]
});
现场演示:

API参考:

编辑: 若要从图表中间的悬停点显示值,请使用适当的选项:

tooltip: {
    borderWidth: 0,
    backgroundColor: 'none',
    shadow: false,
    style: {
        fontSize: '16px'
    },
    headerFormat: '',
    pointFormatter: function() {
        return this.y / 1000 + 'k'
    },
    positioner: function(labelWidth, labelHeight) {
        return {
            x: (this.chart.plotSizeX - labelWidth) / 2 + this.chart.plotLeft,
            y: (this.chart.plotSizeY - labelHeight) / 2 + this.chart.plotTop
        };
    }
}

现场演示:

@ewolden谢谢!这是类似的,但不是我想要的,因为它是一个饼图。如果你看一下fivethirtyeight链接,你会看到窗格内图表中的数据。我可以做极坐标图。。。如果执行我的
R
代码,您将看到。但是我不能像第五个第三十八个例子那样在图表窗格中看到数据。好吧,那么我不确定。我熟悉海图,不是你!我想我的问题不清楚。我已经根据您发送的图表添加了一个图像,其中所需输出中只缺少一个思考。非常感谢。嗨,帕特尔,我已经编辑了答案,现在请检查结果。非常感谢!这正是我们想要的!!我会投你10次赞成票!刚才看到了参数,因此可以在工具提示后缀中添加
k