Earn the coveted Fabric Analytics Engineer certification. 100% off your exam for a limited time only!
Is there a way to put this D3 visual https://c3js.org/samples/chart_gauge.html or this one http://bl.ocks.org/msqr/3202712
into PowerBI? I've just inserted the JS Code inside de D3.JS Visual but it shows just a blank space...
Here is the code
var chart = c3.generate({ data: { columns: [ ['data', 91.4] ], type: 'gauge', onclick: function (d, i) { console.log("onclick", d, i); }, onmouseover: function (d, i) { console.log("onmouseover", d, i); }, onmouseout: function (d, i) { console.log("onmouseout", d, i); } }, gauge: { // label: { // format: function(value, ratio) { // return value; // }, // show: false // to turn off the min/max labels. // }, // min: 0, // 0 is default, //can handle negative min e.g. vacuum / voltage / current flow / rate of change // max: 100, // 100 is default // units: ' %', // width: 39 // for adjusting arc thickness }, color: { pattern: ['#FF0000', '#F97600', '#F6C600', '#60B044'], // the three color levels for the percentage values. threshold: { // unit: 'value', // percentage is default // max: 200, // 100 is default values: [30, 60, 90, 100] } }, size: { height: 180 } }); setTimeout(function () { chart.load({ columns: [['data', 10]] }); }, 1000); setTimeout(function () { chart.load({ columns: [['data', 50]] }); }, 2000); setTimeout(function () { chart.load({ columns: [['data', 70]] }); }, 3000); setTimeout(function () { chart.load({ columns: [['data', 0]] }); }, 4000); setTimeout(function () { chart.load({ columns: [['data', 100]] }); }, 5000);
Any help is much appreciated!
Solved! Go to Solution.
Code sample you show uses C3 library.
D3.JS visual supports only D3.js. Pleae use the second example you have shown.
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
Code sample you show uses C3 library.
D3.JS visual supports only D3.js. Pleae use the second example you have shown.
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals