bubble graphs?

[gavinspearhead]

Hey,

I'm trying to make a bubble chart, that is a sort of scatter plot, where the size of the point is a third parameter. i'm using a line graph, without actually drawing the lines. So far so good. I use the code snippet below. But I want the annotation also to show the third dimension (stored in x.data2) - the ?? in the function below. Is there an easy way to do that?

function format_scatter(area,ctx,data,statData,posi,posj,othervars)
{
    var r =statData[posi][posj].v3 + ", " + statData[posi][posj].v2 + " : ???"  ;
    return r;
}

 options.datasetFill = false;
        options.annotateLabel = format_scatter;
        options.animation= true;
        var data = {
            labels: minmax4(x.labels),
        datasets: [ {
                pointColor: 'cyan',
                pointDotRadius: x.data2,
                strokeColor: 'rgba(0,0,0,0)',
                datasetStrokeWidth: false,
                datasetFill: false,
                pointStrokeColor: 'black',
                data:  x.data,
                xPos:  x.labels,
            }]}
    var myBarChart;
        myBarChart = new Chart(ctx).Line(data, options);

[FVANCOP]

Never thought on how to build bubble charts with ChartNew.js. Your idea is really nice !

For your question : Not tested, but I think something like : data[posi].pointDotRadius[posj]

I also suppose that the annotate is only displayed when the mouse is near the center of your bubbles ; If you have a large one, the annotate will not appear when the mouse is at the border.

I will analyse the "bubble chart" question in the coming weeks and perhaps that I will update a little bit the code to provide a simple solution.

François

[FVANCOP]

It is not "data[posi].pointDotRadius[posj]" but "data.datasets[posi].pointDotRadius[posj]"

François

[gavinspearhead]

Yep that fixes it. Thanx. If you could support scatter / bubble charts more directly, that would be awesome.

Cheers Gavin

[FVANCOP]

Bubble Chart has been implemented in ChartNew.js !

Documentation : https://github.com/FVANCOP/ChartNew.js/wiki/070_015_Bubbles

Examples : Samples\animation_bubble.html Samples\bubble_with_line.html Samples\bubble_with_linear_regression.html