Kuan
Kuan

Reputation: 11389

Why d3 does not work in NW.js

[UPDATE]: it turns out the npm version D3 not works, I change to CDN version, and everything works, but I still wonder what is wrong with require("d3")


All:

I am pretty new to NW.js, currently I am trying to use D3 in it, but even the basic d3.select can not work, any idea? The only thing work with select is d3.select("body")

<div id="app"></div>

<script>
var d3 = require("d3");
function barChart(){

    var width, height;

    function render(root){


        root.append("svg")
            .attr({
                width:width,
                height:height
            })
            .append("rect")
            .attr({
                width: 0.5*width,
                height: 0.5*height
            })
            .style({
                fill:"red"
            })



    }

    render.width = function(value){
        if(value != undefined){
            width = value;
            return render;
        }
        return width;
    }
    render.height = function(value){
        if(value != undefined){
            height = value;
            return render;
        }
        return height;
    }



    return render;
}


// this does not work
var root = d3.select("#app");
var chart = barChart();
chart.width(400).height(400)
chart(root);

</script>

Thanks

Upvotes: 0

Views: 373

Answers (2)

amaslenn
amaslenn

Reputation: 805

I installed d3 using npm and had to write this to get it work:

win.on('loaded', function() {
    d3_root = d3.select(document);
});

Now I can use d3_root.select() instead of d3.select.

As I understand it is because of nwjs context, you are working on "server" side in your script, so you have to choose document first. If you write code directly to html file d3.select() should be OK.

Upvotes: 3

VoidVolker
VoidVolker

Reputation: 1029

You load d3 in nodejs context. Try to load it in browser context:

<script src="js/dependencies/d3.min.js"></script>

Upvotes: 2

Related Questions