[Solved]-how to generate a network graph with edge weight using D3.js force layout-d3.js

Yes, that is possible in D3.js, however, I recommend the webcola library since it is more easy and faster and works very well with D3.js.

Each edge may contain other information besides source and target. So, it is easy to add a weight attribute, e.g.:

let edge = {
  source: node1,
  target: node2,
  weight: 2
};

When using webcola (https://github.com/tgdwyer/WebCola/), you can add some constraints to use your weights, or you can use the linkDistance as a function, explained here: https://github.com/tgdwyer/WebCola/wiki/link-lengths, e.g.:

let weightFactor = 10;
let d3cola = cola.d3adaptor(d3)
                   .size([500, 400])
                   .linkDistance(function (l) { return l.weight * weightFactor; };

So, the steps are:

1. Build your graph with D3.js, however,
2. Simulate it with webcola

You can create an instance of a webcola simulation for d3.js like that:

d3cola.avoidOverlaps(true)
      .handleDisconnected(false)
      .start(30);

let simulation = this.d3cola
    .nodes(graph.nodes) // graph is your graph
    .links(graph.edges)
    .start();