JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.rtl.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.silver.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.mobile.all.min.css" />

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script>

<div id="chart"></div>

JavaScript

let data = [200, 600, 300, 125];
var largestvalue = Math.max.apply(Math, data);
var chart;
var max;

if (largestvalue > 500) {
  max = 1000;
} else if (largestvalue < 500 && largestvalue >= 400) {
  max = 600;
} else if (largestvalue < 400 && largestvalue >= 300) {
  max = 500;
}

$("#chart").kendoChart({
  title: {
    text: "Kendo Chart Example"
  },
  series: [{
    name: "Example Series",
    data: data
  }],
  valueAxis: {},
  categoryAxis: {
    categories: [2000, 2001, 2002, 2003]
  }
});

var chart = $("#chart").data("kendoChart");        
chart.setOptions({
                 valueAxis: {
                              min: 100,
                              max:  max
                            }
            });