We had something a bit similar, a calendar symbol that showed for how many events you where registered.
We used an SVG image for that, because you can actually modify those with just javascript.
I attached our SVG image, so you can check it out; you'll have to rename it to ".svg" to view the image itself, since I can't seem to upload a SVG file here
.
You can basicaly give certain lines and texts ids in an SVG image, which you can address in the javascript. SVG images are basicaly just text files, so you can edit and view them with any text editor, or an image viewer, to see the image itself.
The javascript we use to edit our SVG image looks like this:
Code:
function SVGModifizieren(i1, i2) {
try{
if (document.getElementById("EventsKalender")!="undefined" && document.getElementById("EventsKalender")!=null) {
if (document.getElementById("EventsKalender").querySelector("object")!="undefined" && document.getElementById("EventsKalender").querySelector("object")!=null) {
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlLinksText").textContent=i1;
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlRechtsText").textContent=i2;
if (i1>0) {
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlLinksText").setAttribute("fill","orange");
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlLinksKreis").setAttribute("stroke","orange");
}
if (i2>0) {
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlRechtsText").setAttribute("fill","green");
document.getElementById("EventsKalender").querySelector("object").getSVGDocument().getElementById("ZahlRechtsKreis").setAttribute("stroke","green");
}
}
}
}
catch(err) {}
}
You'll propably have to try a bit to get the right object in the SVG file, but it's possible.
We have a text section with ids (ZahlLinksText/ZahlRechtsText) which we can simply set the textContent to whatever we want.
That javascript function can then be called by the DataFlex WebApp with a 'Send ClientAction "SVGModifizieren" saParams'.