Como exibir um rótulo de sobreposição em um gráfico?

Question

Eu tenho um gráfico criado com Birt e quero adicionar algum rótulo nele para especificar as 4 regiões delimitadas pelos 2 marcadores vermelhos (veja imagem abaixo), uma etiqueta em cada quadrante (centrado se possível).

Eu estou procurando uma solução para fazer isso, usando diretamente editor gráfico birt ou usando um javascript (como eu fiz para os marcadores vermelhos).

Answer 1

A fim de centrar dinamicamente algum tipo de etiqueta em cada quadrante do gráfico, você vai ter que ter alguma forma de calcular as coordenadas. Claro, eu não sou muito familiarizado com Birt e eu estou fazendo a suposição de que os marcadores vermelhos do gráfico irá variar.

De qualquer forma, supondo que você pode obter as coordenadas, você poderia escrever uma função que iria gerar dinamicamente o rótulo com base em um par de parâmetros:

function generateLabel(sContent, iXoffset, iYoffset) {

  var eLabel = document.createElement('span');
  eLabel.appendChild(document.createTextNode(sContent));

  var eDivision = document.createElement('div');
  eDivision.appendChild(eLabel);

  eDivision.style.left = iXoffset + 'px';
  eDivision.style.top = iYoffset + 'px';
  // include other styles here...

  return eDivision;

}

e, em seguida, a partir daí, você pode chamar essa função com o conteúdo do rótulo conjunto e coordenadas Offset:

var eQuadrantOneLabel = generateLabel('Quadrant One', 10, 25);
// and so on...

Em seguida, basta adicionar o elemento de contêiner do gráfico (assumindo que é tem um id de, digamos, graph):

var eGraphContainer = document.getElementById('graph');
eGraphContainer.appendChild(eQuadrantOneLabel);
// and so on for each label...