https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Create-new-D3js-visual/m-p/2347768#M4299 <P>Hi all,&nbsp;</P><P>&nbsp;</P><P>I'm trying to create a new visual with D3JSVisual in power bi. The code bellow work with the dataset1 and dataset2 do you know how can I put power bi data on these dataset... ? Maybe not the good way ?&nbsp;&nbsp;</P><P>I know I have to use pbi.dsv() function but I don't know how...&nbsp;</P><P>&nbsp;</P><P>Thank you !&nbsp;</P><P>&nbsp;</P><LI-CODE lang="javascript"> (function(d3) { 'use strict'; var dataset1 = [ { count: 10 }, { count: 20 }, { count: 30 }, { count: 40 } ]; var dataset2 = [ { count: 10 }, { count: 40 }, { count: 30 }, { count: 40 } ]; var width = 400; var height = 400; var donutWidth = 75; var radius1 = Math.min(width, height) / 2; var radius2 = radius1 - donutWidth; var color1 = d3.scale.category20(); var color2 = d3.scale.category20c(); var svg = d3.select('#chart') .append('svg') .attr('width', width) .attr('height', height); var svg1 = svg.append('g') .attr('transform', 'translate(' + (width / 2) + ',' + (height / 2) + ')'); var svg2 = svg.append('g') .attr('transform', 'translate(' + (width / 2) + ',' + (height / 2) + ')'); var arc1 = d3.svg.arc() .innerRadius(radius1 - donutWidth) .outerRadius(radius1); var arc2 = d3.svg.arc() .innerRadius(radius2 - donutWidth) .outerRadius(radius2); var pie = d3.layout.pie() .value(function(d) { return d.count; }) .sort(null); var path1 = svg1.selectAll('path') .data(pie(dataset1)) .enter() .append('path') .attr('d', arc1) .attr('fill', function(d, i) { return color1(i); }); var path2 = svg2.selectAll('path') .data(pie(dataset2)) .enter() .append('path') .attr('d', arc2) .attr('fill', function(d, i) { return color2(i); }); })(window.d3);</LI-CODE><P>&nbsp;</P> Fri, 18 Feb 2022 13:16:15 GMT freginier 2022-02-18T13:16:15Z https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Create-new-D3js-visual/m-p/2347768#M4299 <P>Hi all,&nbsp;</P><P>&nbsp;</P><P>I'm trying to create a new visual with D3JSVisual in power bi. The code bellow work with the dataset1 and dataset2 do you know how can I put power bi data on these dataset... ? Maybe not the good way ?&nbsp;&nbsp;</P><P>I know I have to use pbi.dsv() function but I don't know how...&nbsp;</P><P>&nbsp;</P><P>Thank you !&nbsp;</P><P>&nbsp;</P><LI-CODE lang="javascript"> (function(d3) { 'use strict'; var dataset1 = [ { count: 10 }, { count: 20 }, { count: 30 }, { count: 40 } ]; var dataset2 = [ { count: 10 }, { count: 40 }, { count: 30 }, { count: 40 } ]; var width = 400; var height = 400; var donutWidth = 75; var radius1 = Math.min(width, height) / 2; var radius2 = radius1 - donutWidth; var color1 = d3.scale.category20(); var color2 = d3.scale.category20c(); var svg = d3.select('#chart') .append('svg') .attr('width', width) .attr('height', height); var svg1 = svg.append('g') .attr('transform', 'translate(' + (width / 2) + ',' + (height / 2) + ')'); var svg2 = svg.append('g') .attr('transform', 'translate(' + (width / 2) + ',' + (height / 2) + ')'); var arc1 = d3.svg.arc() .innerRadius(radius1 - donutWidth) .outerRadius(radius1); var arc2 = d3.svg.arc() .innerRadius(radius2 - donutWidth) .outerRadius(radius2); var pie = d3.layout.pie() .value(function(d) { return d.count; }) .sort(null); var path1 = svg1.selectAll('path') .data(pie(dataset1)) .enter() .append('path') .attr('d', arc1) .attr('fill', function(d, i) { return color1(i); }); var path2 = svg2.selectAll('path') .data(pie(dataset2)) .enter() .append('path') .attr('d', arc2) .attr('fill', function(d, i) { return color2(i); }); })(window.d3);</LI-CODE><P>&nbsp;</P> Fri, 18 Feb 2022 13:16:15 GMT https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Create-new-D3js-visual/m-p/2347768#M4299 freginier 2022-02-18T13:16:15Z