Актуальная проблема конфигурации полукруглой диаграммы - PullRequest
0 голосов
/ 31 октября 2018

В настоящее время я работаю над требованием, согласно которому пользователь может щелкнуть мышью по заштрихованной области полукруглой диаграммы и перейти на новую страницу в приложении. Мне также нужно выдавать разные выходы в соответствии с кликами на разных участках пилотируемые области ... Я прошел через Highchart API и нашел решение, но мой код не работает ... Может кто-нибудь помочь мне с этим, пожалуйста.

this.chart = new Highcharts.Chart('container', 
    {
      chart: {
        plotBackgroundColor: null,
        plotBorderWidth: 0,
        height: 400,        
        plotShadow: false
      },
      title: {
        text: '98',
        style: {
          "fontSize": "48px"
        },
        align: 'center',
        verticalAlign: 'middle',
        y: 50
      },
      credits: {
        enabled: false
     },
      tooltip: {
        pointFormat: 'Test: <b>{point.percentage:.1f}%</b>',
        enabled:false
      },
      colors: ['#FF0000', '#FFA500', '#FFFF00'],
      plotOptions: {
        pie: {
          dataLabels: {
            enabled: true,
            distance: -100,
            style: {
              fontWeight: 'bold',
              color: 'white'
            }
          },
          point: {
              events: {
                click: function (e) {
                  alert("Clicked");
                }
              }
            },
          startAngle: -90,
          endAngle: 90,
          center: ['50%', '75%'],
          size: '110%'
        }
      },
      series:[
        {
           data: [
            {y: 1, name:"", id:"0"}, 
            { y: 7, name:"",  id:"1"},
            { y: 2, name:"", id:"2"}
           ],
           innerSize: '65%',
            type: 'pie',

        }
     ]
    }

  );

1 Ответ

0 голосов
/ 31 октября 2018

Отсутствует привязка к контексту, измените событие клика, как показано ниже:

events:{
    click: (function(e) {
      console.log(e.point);
      if(e.point.name == "1"){
        alert('Clicked 1');
      }
      else if(e.point.name == "2"){
        alert('Clicked 2');
      }

    }).bind(this)
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...