how to add images within nodes

irappab

unread,

Feb 28, 2012, 1:50:51 AM2/28/12

to protovis

Please help me to insert different images within different nodes.

lynxoid

unread,

Feb 29, 2012, 11:13:10 AM2/29/12

to protovis

use can use a url() function on the nodes:

panel.node.add(pv.Image)
.url("node_iimage.png")
.imageWidth(getDefaultSize)
.imageHeight(getDefaultSize)

irappa bisanakoppa

unread,

Feb 29, 2012, 12:28:49 PM2/29/12

to prot...@googlegroups.com

Hi,

        Thank you very much for your solution. But still its not working. Please find the code below and suggest me for the code to place image within nodes:

<html>
<head>
    <title>Force-Directed Layout</title>
    <script type="text/javascript" src="protovis.js"></script>
    <script type="text/javascript" src="miserables.js"></script>
    <style type="text/css">

body {
margin: 0;
}

    </style>
</head>
<body>
    <script type="text/javascript">

var w = document.body.clientWidth,
    h = document.body.clientHeight,
    colors = pv.Colors.category19();

var vis = new pv.Panel()
    .width(w)
    .height(h)
    .fillStyle("white")
    .event("mousedown", pv.Behavior.pan())
    .event("mousewheel", pv.Behavior.zoom());

var force = vis.add(pv.Layout.Force)
    .nodes(miserables.nodes)
    .links(miserables.links);

force.link.add(pv.Line);

force.node.add(pv.Dot)
    .size(function(d) (d.linkDegree + 10) * Math.pow(this.scale, -1.5))
    .fillStyle(function(d) d.fix ? "red" : colors(d.group))
    .strokeStyle(function() this.fillStyle().darker())
    .lineWidth(1)
    .title(function(d) d.nodeName)
    .event("mousedown", pv.Behavior.drag())
    .event("drag", force);

    force.node.add(pv.Image)
     .url("index.jpg")
     .imageWidth(getDefaultSize)
     .imageHeight(getDefaultSize);

vis.render();

    </script>
</body>
</html>

--
You received this message because you are subscribed to the Google Groups "protovis" group.
To post to this group, send email to prot...@googlegroups.com.
To unsubscribe from this group, send email to protovis+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/protovis?hl=en.

--

Warmest Regards,

Irappa Bisanakoppa

mobile: +919880969627

Reply all

Reply to author

Forward