라이브러리/Kendo

Kendo Chart 각 차트에 border style 주는 방법

개발하는 까꿍이 2022. 7. 1. 09:02

series 속성에 border를 객체 형태로 주면 된다.

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.2.621/styles/kendo.default-v2.min.css"/>

    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2022.2.621/js/kendo.all.min.js"></script>
</head>
<body>
  
<div id="chart"></div>
<script>
$("#chart").kendoChart({
  dataSource: [
    { value: 1, test: 5 },
    { value: 2, test: 1 }
  ],
  series: [
    { 
      field: "value",
    	border: {
        width: 2,
        color: "black",
        dashType: "dash",
      },
    },
    { 
      field: "test",
    	border: {
        width: 3,
        color: "red",
      },
    }
  ]
});
var chart = $("#chart").data("kendoChart");
var data = chart.dataSource.at(0);
chart.dataSource.remove(data);
</script>
</body>
</html>

 

참고