US and Worldwide: +1 (866) 660-7555
Results 1 to 3 of 3

Thread: Define Size of dot

  1. #1

    Exclamation Define Size of dot

    friends,


    someone has managed to change the size of the point on the graph CCC Dot Chart dynamically the third dimension?


    I've tried (dot_ShapeRadius, dor_ShapeSize)


    I've tried the component Protovis, but such property does not work.


    My recordser CDA:
    CDA.jpg


    Component Protovis:
    =====================================
    function(vis,queryResult){


    var data = queryResult.resultset.map
    (
    function(d) {
    return {
    x: d[0],
    y: d[1],
    z: d[2],
    t: d[3]
    };
    }
    );




    /* Sizing and scales. */
    var w = this.width,
    h = this.height,
    x = pv.Scale.linear(-0.1, 100).range(0, w),
    y = pv.Scale.linear(-0.1, 100).range(0, h),
    c = pv.Scale.log(1, 100).range("orange", "brown");




    /* Y-axis and ticks. */
    vis.add(pv.Rule)
    .data(y.ticks())
    .bottom(y)
    .strokeStyle(function(d) { return d ? "#eee" : "#000" } )
    .anchor("left").add(pv.Label)
    .visible(function(d) { return d > 0 && d < 1 } )
    .text(y.tickFormat);


    /* X-axis and ticks. */
    vis.add(pv.Rule)
    .data(x.ticks())
    .left(x)
    .strokeStyle(function(d) { return d ? "#eee" : "#000" } )
    .anchor("bottom").add(pv.Label)
    .visible(function(d) { return d > 0 && d < 1} )
    .text(x.tickFormat);


    /* The dot plot! */
    vis.add(pv.Panel)
    .data(data)
    .add(pv.Dot)
    .left(function(d) { return x(d.x) })
    .bottom(function(d) { return y(d.y) } )
    .strokeStyle(function(d) { return c(d.z) } )
    .fillStyle(function() { return this.strokeStyle().alpha(.2) } )
    .shape("circle") // "circle", "square", "triangle", "cross", "diamond"
    .size ( function (d) { { return c(d.z) } ) // ******* NOT WORK
    .title(function(d)
    {
    return d.t + ' - ' + (d.z) + '%, Faturamento ' + d.x + ' Servico' + d.y
    }
    );
    }

    Component CCC DOT CHART:
    =====================================
    "id": "3eff7a18-7411-4bc0-90e7-8bc5a231f7bc",
    "type": "ComponentscccDotChart",
    "typeDesc": "CCC Dot Chart",
    "meta_cdwSupport": "true",
    "parent": "CHARTS",
    "properties": [
    {
    {
    "name": "cccExtensionPoints",
    "value": "[[\"dot_shapeSize\",\"function(d) { return d.z; }\"]]",
    "type": "ValuesArray"
    },

    ]
    }

  2. #2
    Join Date
    Jul 2013
    Posts
    12

    Default

    Great explanation..thanks out there..really helpful.

  3. #3
    Join Date
    Mar 2012
    Posts
    642

    Default

    Hi, for the CDE Protovis component, the CCC Dot and the CCC Metric Dot charts, the extension points are named "shapeRadius" and "shapeSize".
    For CCC charts, "dot_shapeRadius" and "dot_shapeSize".

    The CCC Metric Dot chart supports binding data to the dot size, through the "size" visual role. See, for example: small-multiple-bubbles.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •