nginstack

Class: HighchartsVisualizationDef

@nginstack/web-framework/lib/dsv/HighchartsVisualizationDef~ HighchartsVisualizationDef

new HighchartsVisualizationDef()

Classe abstrata que contém as configurações de visualizações de data sources com a utilização de gráficos.

Importante: o Web Framework também possui integração com a biblioteca de código aberto ECharts, uma alternativa ao Highcharts, sem custos de licenciamento.

Example
// Exemplo de definição de uma visualização em gráfico
{
  type: 'highcharts',
  dataSourceQuery: -1891504223, // Usuários habilitados.idsq
  filters: [
    {name: "begin", label: "Data inicial", required: true},
    {name: "end", label: "Data final", required: true}
  ],
  onGetOptions: function (dsv, ds) {
    var countByStatus = {};
    forEachRecord(ds, function (record) {
      var status = record.u_istatus_iname;
      var count = countByStatus[status] || 0;
      countByStatus[status] = count + 1;
    });
    var categories = [];
    var data = [];
    Object.keys(countByStatus).forEach(function (key) {
      categories.push(key);
      data.push(countByStatus[key]);
    });
    return {
      chart: {
        defaultSeriesType: 'column'
      },
      title: {
        text: dsv.title
      },
      xAxis: {
        title: 'Usuários por status',
        categories: categories
      },
      yAxis: {
        title: {
          text: 'Quantidade'
        }
      },
      series: [
        {
          name: 'Usuários',
          data: data
        }
      ]
    }
  }
}

Extends

  • DataVisualizationDef

Members

onGetOptions :function

Função executada quando a visualização em gráfico é criada. Recebe a visualização e o DataSet obtido pelo DataSource, e deve retornar as opções de um gráfico, conforme documentado em Chart

Type:
  • function

type :string

O tipo desta visualização. Deve ser obrigatoriamente preenchido com o valor 'highcharts'.

Type:
  • string
Default Value:
  • 'highcharts'