CODEWITHSUNDEEP
javascriptangularjscharts
hayev
hayev

Reputation: 31

How to hide border for Angular-Chart.js - Chart-pie

I use Angular-Chart.js (the AngularJS Chart.js version) to create a pie. How can I hide the white border ?

 <canvas id="doughnut" class="chart chart-pie"
 chart-data="data" chart-options="options"  chart-colors="colors"     chart-dataset-override="datasetOverride"; chart-labels="labels" style="width:100px; height:100px;">
</canvas>

$scope.colors = [ "#C94C49", "#D68550", "#EEA638", "#A7A737", "#85A963", "#89AAAF", "#39AAAF"];

$scope.data = [12,67,34,9,5,33,71];

pie

Upvotes: 3

Views: 1950

Answers (1)

xboomx
xboomx

Reputation: 173

Try to reset option segmentShowStroke:false

In regular Chart.js:
var cntx = document.getElementById("yourChartID").getContext("2d");
var yourChart = new Chart(cntx).Pie(dataOfChart, {segmentShowStroke: false});

In Angular its enought to assign options in html as you already have:
chart-options="options"

and then if you don't have any other options try:
$scope.options = { segmentShowStroke : false };

UPDATE:
In newer version segmentShowStroke may not work.
In that case try this:
$scope.options = { elements: { arc: { borderWidth: 0 } } };

Upvotes: 5

Related Questions