Подтвердить что ты не робот

Как удалить белую границу с круговой диаграммы Chart.js?

Я использую диаграмму диаграммы Chart.js, и я бы хотел удалить белые линии между срезами. Может ли кто-нибудь сказать мне, как это сделать? Спасибо заранее

Я не видел ничего в предложении.

    <div class="pie-chart">
         <div id="canvas-holder">
              <canvas id="chart-area" width="250" height="250"/>
         </div>
    </div>

Ответ 1

UPDATE

Для более новых версий Chart.js(т.е. 2.2.2 и выше) см. @grebenyuksv answer.

Этот ответ был добавлен для более старой версии Chart.js(т.е. 1.0.2)

Оригинальный ответ

Просто настройте параметры диаграммы, чтобы скрыть строку

segmentShowStroke: false

Что-то вроде этого:

//create chart
var ctx = document.getElementById("myChart").getContext("2d");

var data = [{
  value: 300,
  color: "#F7464A",
  highlight: "#FF5A5E",
  label: "Red"
}, {
  value: 50,
  color: "#46BFBD",
  highlight: "#5AD3D1",
  label: "Green"
}, {
  value: 100,
  color: "#FDB45C",
  highlight: "#FFC870",
  label: "Yellow"
}];

var options = {
  //Boolean - Whether we should show a stroke on each segment
  // set to false to hide the space/line between segments
  segmentShowStroke: false
};

// For a pie chart
var myPieChart = new Chart(ctx).Pie(data, options);

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.js"></script>
<canvas id="myChart" width="200" height="200"></canvas>

Ответ 2

В [email protected] (не проверено для [email protected]):

const options = {
    elements: {
        arc: {
            borderWidth: 0
        }
    }
};

Ответ 3

datasets: [
            {
                label: "TeamB Score",
                data: [20, 35, 40, 60, 50],
                backgroundColor: [
                    "#FAEBD7",
                    "#DCDCDC",
                    "#E9967A",
                    "#F5DEB3",
                    "#9ACD32"
                ],
                borderColor: [
                    "#E9DAC6",
                    "#CBCBCB",
                    "#D88569",
                    "#E4CDA2",
                    "#89BC21"
                ],
                borderWidth: [1, 1, 1, 1, 1]
            }
        ]