如何在角度图中制作钟形曲线的条形？

Question

我正在使用angular-chart在我的web应用程序中绘制图表。我想让用户界面的图表中的条，如图所示。我已经尝试了很多来实现这个UI，但是我不能实现它。此外，我还在其他库中搜索了相同的UI。我们可以在图表上画一条钟形曲线，但我想让每一条柱子看起来都像钟形曲线。

这是angular-chart的JsFiddle。

这是我想要做的代码。

https://jsfiddle.net/quekid/untd28yq/

$scope.datasetOverride = [{ yAxisID: 'y-axis-1' }, { yAxisID: 'y-axis-2'   }];
$scope.options = {
scales: {
  yAxes: [
    {
      id: 'y-axis-1',
      type: 'linear',
      display: true,
      position: 'left',
      ticks: {
            beginAtZero:true,
            suggestedMin: 0
        }
    },
    {
      id: 'y-axis-2',
      type: 'linear',
      display: false,
      position: 'right'
    }
   ]
 }
};

Answer 1

请尝试使用

 $scope.colors= [{ 
                                fill: true,
                 backgroundColor: "#cb2431"
              }]; 

这将是填充图形下的区域，它的工作为我。试试看吧

jsfiddle