Как проверить, возможно ли создание круговой диаграммы или нет с динамическими данными? - PullRequest
Новая
       59

Как проверить, возможно ли создание круговой диаграммы или нет с динамическими данными?

0 голосов
/ 10 ноября 2019

Я хочу создать круговую диаграмму, используя библиотеку plotly. Так что в основном у моего приложения есть возможность выбрать метки и поля значений из выпадающего списка, и там могут быть любые данные. Я передаю это, чтобы построить круговую диаграмму. Здесь возникает проблема: когда я выбираю правильные метки и значения, тогда он показывает круговую диаграмму, а когда я выбираю некоторые другие опции, он ничего не показывает. Для этого сценария я хочу показать что-то вроде: «ПИРОГОВАЯ ДИАГРАММА НЕ МОЖЕТ СОЗДАТЬСЯ ДЛЯ ВЫБРАННЫХ ДАННЫХ» или что-то в этом роде. Как я могу добиться этого?

Вот код - 

 let object = {};
        object = this.graphService.plotPie(
          this.x_axis,
          this.y_axis,
          this.x_axis_title,
          this.y_axis_title
        );
        Plotly.newPlot(
          "myDiv1",
          object["data"],
          object["layout"],
          { showSendToCloud: true },
          { responsive: true },
          { scrollZoom: true }
        );


-----------------------------------------------------------------------------

plotPie(x_axis, y_axis, x_axis_title, y_axis_title) {
    var data = [
      {
        values: [19, 26, 55] || x_axis,
        labels: ["Residential", "Non-Residential", "Utility"] || y_axis,
        // domain: {column: 0},
        name: "Pie",
        hoverinfo: "label+value",
        hole: 0.4,
        type: "pie"
      }
    ];
    var layout = {
      // title: `Pie Graph ${x_axis_title} vs ${y_axis_title}`,
      font: {
        family: "Arial Black",
        size: "14px"
      },
      height: 300,

      margin: {
        l: 50,
        t: 40,
        b: 40,
        r: 40
      },
      legend: {
        orientation: "h",
        x: 0,
        y: 1.3
      },
      xaxis: {
        showgrid: true,
        zeroline: false,
        showline: true,
        linewidth: 2,
        linecolor: "black",
        tickfont: {
          size: 11
        }
      },
      yaxis: {
        showgrid: true,
        zeroline: false,
        showline: true,
        linewidth: 2,
        linecolor: "black",
        tickfont: {
          size: 11
        }
      },
      plot_bgcolor: "white",
      paper_bgcolor: "white",
      showlegend: true
    };

    return { data, layout };
  }

Фактический результат будет - Для правильного выбора данных он должен отображать круговую диаграмму, а для неправильного выбора данных он должен отображать некоторыеСообщение об ошибке;

...