Wie ein Overlay-Etikett auf einem Diagramm angezeigt werden?
-
22-08-2019 - |
Frage
Ich habe ein Diagramm mit Birt erstellt und ich mag etwas Label hinzuzufügen auf sie die vier Regionen von den zwei roten Markierungen (siehe Bild unten) begrenzt ist, um anzugeben, ein Etikett in jedem Quadranten (zentriert, wenn möglich).
Ich bin auf der Suche nach einer Lösung, das zu tun, direkt birt Grafik-Editor oder durch eine mit Javascript (wie ich für die roten Markierungen getan).
Lösung
Um dynamisch in jedem Quadranten des Graphen eine Art Etikett zu zentrieren, werden Sie eine Möglichkeit zur Berechnung der Koordinaten haben müssen. Natürlich bin ich mit Birt nicht wirklich vertraut und ich die Annahme mache, dass die roten Markierungen des Diagramms variieren.
Wie auch immer unter der Annahme, dass Sie die Koordinaten erhalten, können Sie eine Funktion schreiben könnten, die das Label dynamisch erzeugen würde, basierend auf ein paar Parameter:
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;
}
und dann von dort aus, können Sie diese Funktion mit dem Set-Label Inhalt aufrufen und Offset-Koordinaten:
var eQuadrantOneLabel = generateLabel('Quadrant One', 10, 25);
// and so on...
Dann fügen Sie einfach das Element an den Behälter Graph (unter der Annahme, dass ist eine id
von hat, sagen sie, graph
):
var eGraphContainer = document.getElementById('graph');
eGraphContainer.appendChild(eQuadrantOneLabel);
// and so on for each label...