<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
        series: [
          {
            type: "candlestick",
            colorField: "color",
            labels: {
              visible: true,
              format: "{0}",
            },
            data: [
              {
                date: new Date(2024, 0, 1),
                open: 150.25,
                high: 152.8,
                low: 149.5,
                close: 152.3,
                color: "#f44336",
              },
              {
                date: new Date(2024, 0, 2),
                open: 152.5,
                high: 154.2,
                low: 151.8,
                close: 153.75,
                color: "#4caf50",
              },
              {
                date: new Date(2024, 0, 3),
                open: 153.8,
                high: 155.4,
                low: 152.9,
                close: 154.2,
                color: "#2196f3",
              },
              
            ],
            openField: "open",
            highField: "high",
            lowField: "low",
            closeField: "close",
            dateField: "date",
            name: "Stock Price",
            color: "#03a9f4",
            downColor: "#f44336",
          },
        ],
        navigator: {
          series: {
            type: "line",
            data: [
              {
                date: new Date(2024, 0, 1),
                open: 150.25,
                high: 152.8,
                low: 149.5,
                close: 152.3,
              },
              {
                date: new Date(2024, 0, 2),
                open: 152.5,
                high: 154.2,
                low: 151.8,
                close: 153.75,
              },
              {
                date: new Date(2024, 0, 3),
                open: 153.8,
                high: 155.4,
                low: 152.9,
                close: 154.2,
              },
              
            ],
            field: "close",
            dateField: "date",
            color: "#ff9800",
          },
        },
      });
</script>