> For the complete documentation index, see [llms.txt](https://information9527.gitbook.io/html/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://information9527.gitbook.io/html/qu-xian-tu/untitled/color-she-ding.md).

# Line 設定

### 設定資料

先設定給data 變數以及options ，先看下方範例。

```javascript
var option ={};
var datas ={
    labels: ['熱處理', '基磨', '成磨', 'QA成品'],
    datasets: [{
        label: '使用次數',
        data: [65, 60, 70, 74],
        fill: false,
        backgroundColor:[
            'rgba(54, 162, 235, 1)'
        ],
        borderColor: [
            'rgba(54, 162, 235, 1)'
        ],
        borderWidth: 1,
    }],
};

function Line_Status_1() {
    var ctr = $('#Line__canvaas_1');
    var line = new Chart(ctr, {
        type: 'line',
        data: datas,
        options:option
    });
}
```

### 新增一個 labels 以及line 

![](https://3336654295-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDPdvZ3NzJOlXMhEq_2%2F-MdFKgEyxck5wh_TMNhM%2F-MdFLDQQaOKQq_45U8M1%2Fimage.png?alt=media\&token=a6a5b04e-f682-4a66-b702-5431b5b4e611)

```javascript
var datas ={
    labels: ['熱處理', '基磨', '成磨', 'QA成品'],
    datasets: 
    [
        {
            label: '使用次數',
            data: [65, 60, 70, 74],
            fill: false,
            backgroundColor:[
                'rgba(54, 162, 235, 1)'
            ],
            borderColor: [
                'rgba(54, 162, 235, 1)'
            ],
            borderWidth: 1,
        },
        {
            label:'停機次數',
            data: [45, 36, 31,40],
        }
    ],
};

```

## Color設定

| Name              | Type    | Default              | Description       |
| ----------------- | ------- | -------------------- | ----------------- |
| `backgroundColor` | `Color` | `rgba(0, 0, 0, 0.1)` | Background color. |
| `borderColor`     | `Color` | `rgba(0, 0, 0, 0.1)` | Border color.     |
| `color`           | `Color` | `#666`               | Font color.       |