multiline annotations

[gavinspearhead]

In the original chart.js you could specify a multitooltiptemplate for a stacked bar. Then it would just show a block with the colour of the bar , the label and the value in one tooltip for all the values in the stacked bar like A: 10 B:20 C:40 D: 100

In ChartNew js I see a tooltip for just the particular value if I hover over the particular bar (I just see A:10 on the pop up for the first, B:20 for the second etc). Is it possible to get the chart.js multiline behaviour?

[FVANCOP]

Yes, see Samples/bar_and_lines_with_detectAnnotateOnFullLine.html

This sample is for option "detectAnnotateOnFullLine" which is not necessary in your case.. But you can extrapolate this sample to achieve what you want.

François

[gavinspearhead]

Okay cool. That works. Thanks.

But now the tooltip is partly outside the window. From the wiki I found annotateRelocate, but that moves the tooltip way far out left beyond the graph making it invisible. FYI I dynamically adjust the canvas size to become full screen (minus a bit)with this jquery code: var width = $(document).width() - 20; var height = $(document).height() - 5; var posy = $("#myChart").position().top; var posy2 = $("#titlebar").position().top; $("#myChart").attr({ width: width}); $("#myChart").attr({height: height - (posy+posy2) });

If I zoom in with the browser (using ctrl++) I see the tooltip way left of the canvas. Any way to fix this? (see graph below). This happens both in FF and chrome.

Also I notice that it doesn't show 0 values for statData[i][posj].v3. Bug?

And finally note that the largest stack is less that half of the height of the graph. Any way to fix this too?

This I'm using for the annotateLabel function function annotateAllX(area,ctx,data,statData,posi,posj,othervars) { var retstring = ''; if (data.datasets.length == 1) { retstring = statData[0][posj].v2 + ": "+statData[0][posj].v3 + "< br>"; } else { retstring="< b>" + statData[posi][posj].v2 + '< br>';

    for(var i=0;i<data.datasets.length;i++){
        if(typeof statData[i][posj].v3 != "undefined" && data.datasets[i].type != "Line") {
            retstring = retstring + statData[i][posj].v1 + ": " + statData[i][posj].v3 + "< br>";
        }
    }
}
return retstring;

}

[FVANCOP]

I did not test the annotateRelocate option for multi-lines annotations and the new computed new position was not correct in that case. Problem has been solved. I'm not 100 % happy with the new code, but it is much better than previous code (I hope so).

Download the last code and try it...

[gavinspearhead]

It is definitively an improvement. Thanx. :)

Unfortunately, the popup is still not entirely on the screen (as the top of the popup is at the same level as the cursor). See the image below. Is it not possible to move the popup at the cursor position if the length of the popup extends the screen size. Basically making the popup sitting at the bottom of the screen (or canvas would probably be even better). Similarly, make it sit on the right if the popup extends to the right of the screen? Because now it overflows to the right as well.

Also it still doesn't show 0 values for statData[i][posj].v3. (EG as show in the picture below. There should be a 0 behind the CAA:.

(btw the cut off on the left is my silly cut and paste mistake. It's correctly displayed on the screen)

[FVANCOP]

For the zero value, I have a bypass : use ".datavalue" instead of ".v3" in function annotateAllX (The code of the Sample has been updated 4 days ago, but I forgot to mention the solution).

For the other problem, is it possible to send the data and options used (for instance to my email address that is referred in the code of ChartNew.js) ?

[gavinspearhead]

The code is here: https://raw.githubusercontent.com/gavinspearhead/passivedns/master/www2/plot2.php

If you cut out the php and chance line 64 to html = {"labels":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23],"data":["4486","3444","54","35","78","170","88","164","597","969","2709","2231","2442","925","1581","1762","2707","3788","3733","3108","1173","636","4672","7210"],"title":"Queries per hour","legend":"A","options":{"source":{"last":"Last seen","first":"First seen"},"subtype":{"basic":"basic","any":"any","a":"a","aaaa":"aaaa","caa":"caa","cds":"cds","cert":"cert","cname":"cname","dhcid":"dhcid","dlv":"dlv","dname":"dname","dnskey":"dnskey","ds":"ds","gpos":"gpos","hinfo":"hinfo","ipseckey":"ipseckey","kx":"kx","loc":"loc","mx":"mx","naptr":"naptr","ns":"ns","nsec":"nsec","nsec3":"nsec3","nsec3param":"nsec3param","ptr":"ptr","rp":"rp","rrsig":"rrsig","soa":"soa","spf":"spf","srv":"srv","sshfp":"sshfp","tlsa":"tlsa","txt":"txt"}},"type":"hour","data2":[{"data":["936","676","4","1","3","55","3","2","42","85","427","425","385","167","258","289","492","710","775","511","110","69","868","1331"],"legend":"AAAA"},{"data":[0,"3",0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],"legend":"CAA"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"1"],"legend":"CDS"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"CERT"},{"data":["960","690",0,"3","2","6","3","8","60","196","529","461","462","180","422","403","566","758","744","544","169","54","1021","1714"],"legend":"CNAME"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"DHCID"},{"data":["4","4",0,0,0,0,0,0,0,0,0,0,"9",0,0,0,0,0,0,0,0,0,0,0],"legend":"DLV"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"DNAME"},{"data":["201","244","3",0,0,"16",0,0,"19","20","91","39","194","40","72","93","178","79","102","40","25","3","126","55"],"legend":"DNSKEY"},{"data":["112","182",0,0,0,"6",0,0,"7","12","36","14","104","31","41","62","136","61","90","24","4","2","59","30"],"legend":"DS"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0],"legend":"GPOS"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,"1"],"legend":"HINFO"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"IPSECKEY"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"KX"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"2","1",0,0,0,0,0,0],"legend":"LOC"},{"data":["6","6",0,0,0,0,0,0,0,0,"3","3",0,"7",0,"6","5","4","12","3",0,0,"1",0],"legend":"MX"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"1","3","3",0,0,0,0,0],"legend":"NAPTR"},{"data":["7","26",0,0,0,0,0,0,0,0,"2","3","3","14","3","4","14","27","12","1",0,0,0,0],"legend":"NS"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0],"legend":"NSEC"},{"data":[0,"1",0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"NSEC3PARAM"},{"data":["685","124",0,0,0,0,0,0,0,"1",0,"24","243","18","1","1","444","34","2","107","1","5","9","48"],"legend":"PTR"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0],"legend":"RP"},{"data":["917","888","115","96","89","184","39","90","85","108","331","194","480","146","206","471","725","398","489","314","124","61","536","419"],"legend":"RRSIG"},{"data":["3","3",0,0,0,0,0,0,0,0,"2","2",0,"1",0,"1","3","4","2",0,0,0,0,0],"legend":"SOA"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,"1",0,0,0,0,0,0],"legend":"SPF"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,0,0,0,0,0,0,0],"legend":"SRV"},{"data":[0,0,0,0,0,0,0,0,0,0,0,0,"1",0,0,0,0,"3",0,0,0,0,0,0],"legend":"SSHFP"},{"data":["10","26",0,0,0,0,0,0,0,0,0,"4",0,0,"1","15","2","1","10","2",0,0,"3","1"],"legend":"TLSA"},{"data":["6","5",0,0,0,0,0,0,0,0,"4","2",0,"2",0,"1",0,"4","5",0,0,0,"1","5"],"legend":"TXT"}]};

[gavinspearhead]

Datavalue fixes the 0 indeed. Thanx

[FVANCOP]

The line count was based on "
" in uppercase only... Problem has been fixed. Can you download the last version and retry ?

Thanks for your cooperation.

[gavinspearhead]

That's a huge improvement :) Thanx again.