New to Kendo UI for jQuery? Start a free 30-day trial

Navigator.hint

configuration

Default options for the navigator hint.

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    navigator: {
        hint: {
            visible: true,
            format: "From: {0:d} To: {1:d}"
        }
    }
});
</script>

The format of the hint.

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    navigator: {
        hint: {
            format: "From: {0:MMM yyyy} To: {1:MMM yyyy}"
        }
    }
});
</script>
String | Function

The hint template. Template variables:

  • from - The lower boundary of the selected range
  • to - Theupper boundary of the selected range
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    navigator: {
      hint: {
        template: "From: #= from # To: #= to #"
      },

      series: {
        type: "line",
        field: "value",
        categoryField: "date",
        data: [
          { value: 1, date: new Date(2012, 1, 1) },
          { value: 2, date: new Date(2012, 1, 2) },
          { value: 1, date: new Date(2012, 1, 3) }
        ]
      }
    }
});
</script>

The visibility of the hint.

Default: true

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    navigator: {
        hint: {
            visible: false
        }
    }
});
</script>