d3.js - d3js: multiple bar graphs arranged in a specific order -


I want to attract the graph several times and want to organize them at specific places using D3 JS. Basically something like this:

Enter image details here

I have already prepared the articles separately, but are not sure how to attract more than one small bar graph and keep them as shown in the picture.

Any suggestions or links can be helpful

as shown in the figure To create several charts, you will need a data structure that allows you to calculate the layout for the chart: Data structure can be something like this:

  var data = [[line : 0, column: 0, data: [{x: 1, y: 1}, {x: 2, y: 2}, ...]}, {line: 0, colonel: 1, data: [x : 1, y: 2}, {x: 2, y: 3}, ...]},]   

Then, you need to implement your chart Awareness will, so you can create charts in any numbers without repeating the code and follow the 3-D style. Assuming that you have a reusable chart barchart , you will need to configure it, create a container element for your chart, and start your chart:

 < code> // create and configure bararks var chart = barracks (). Wthath (100) Height (100); // Create SVG Elements and set its size ... // Create a group for each element in the data array var gcharts = svg.selectAll ('g.chart'). Data (data) .enter () Annex () 'G') .attr ('class', 'chart'); // translate groups using rows and columns gcharts.attr ('transform', function (d) {return 'translate (' + 100 * d.row + ',' + d.col + ')'; }); // Using the bound data for each selection, create the chart; gcharts.call (barchart); Regards,   

Comments

Popular posts from this blog

Pass DB Connection parameters to a Kettle a.k.a PDI table Input step dynamically from Excel -

multithreading - PhantomJS-Node in a for Loop -

c++ - MATLAB .m file to .mex file using Matlab Compiler -