как добавить контекстное меню правой кнопкой мыши для AmCharts

Question

Это мой код Am-диаграммы. Здесь я создаю амчарт. Я написал код контекстного меню правой кнопкой мыши и привязал его к диаграмме div. Я хочу показать контекстное меню, когда происходит событие правого щелчка, но оно не работает. Есть ли способ создать контекстное меню для amcharts.

Ресурсы для amcharts:

am4core.ready(function() {
  // Themes begin
  am4core.useTheme(am4themes_animated);
  // Themes end Create chart instance
  var chart = am4core.create("chartdiv", am4charts.PieChart);
  // Add data
  chart.data = [{
    "country": "Lithuania",
    "litres": 501.9
  }, {
    "country": "Czechia",
    "litres": 301.9
  }, {
    "country": "Ireland",
    "litres": 201.1
  }];
  // Add and configure Series
  var pieSeries = chart.series.push(new am4charts.PieSeries());
  pieSeries.dataFields.value = "litres";
  pieSeries.dataFields.category = "country";
  pieSeries.slices.template.stroke = am4core.color("#fff");
  pieSeries.slices.template.strokeWidth = 2;
  pieSeries.slices.template.strokeOpacity = 1;

  // This creates initial animation
  pieSeries.hiddenState.properties.opacity = 1;
  pieSeries.hiddenState.properties.endAngle = -90;
  pieSeries.hiddenState.properties.startAngle = -90;
}); // end am4core.ready()
$(document).bind("contextmenu", function(event) {
  if (event.toElement.id == 'chartdiv') {
    // Avoid the real one
    event.preventDefault();

    // Show contextmenu
    $(".custom-menu").finish().toggle(100).

    // In the right position (the mouse)
    css({
      top: event.pageY + "px",
      left: event.pageX + "px"
    });
  }
});
// If the document is clicked somewhere
$(document).bind("mousedown", function(e) {
  // If the clicked element is not the menu
  if (!$(e.target).parents(".custom-menu").length > 0) {
    // Hide it
    $(".custom-menu").hide(100);
  }
});

<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js"></script>
<!-- HTML -->
<div id="chartdiv"></div>
<ul class='custom-menu'>
  <li data-action="first">Adventure 360</a>
  </li>
  <li data-action="second">AmCharts</li>
</ul>