Hi I have recently started working on power custom visualization.
While working on .ts file looking at the examples my d3.select is not working.
What could be the poosible reason for it?
I have imported the typings for d3 and included in the file structure. But its still not working and it shows no error while i tried to run it.
export class Visual implements IVisual {
private target: HTMLElement;
private barDataPoints: nodeTreeViewPoints[];
private host: IVisualHost;
private svg: d3.Selection<SVGElement>;
private barContainer: d3.Selection<SVGElement>;
private xAxis: d3.Selection<SVGElement>;
private selectionManager: ISelectionManager;
static Config = {
xScalePadding: 0.1,
solidOpacity: 1,
transparentOpacity: 0.5,
margins: {
top: 0,
right: 0,
bottom: 25,
left: 30,
},
xAxisFontMultiplier: 0.04,
};
constructor(options: VisualConstructorOptions) {
this.host = options.host;
this.selectionManager = options.host.createSelectionManager();
console.log("aaaaa111");
this.svg = d3.select(options.element);
let svg = this.svg;
console.log("aaaaa");
this.barContainer = svg.append('g')
.classed('nodeGraphArea', true);
this.xAxis = svg.append('g')
.classed('xAxis', true);
}
the "aaaa " never prints on the console.
Solved! Go to Solution.
Hi I have recently started working on power custom visualization.
While working on .ts file looking at the examples my d3.select is not working.
What could be the poosible reason for it?
I have imported the typings for d3 and included in the file structure. But its still not working and it shows no error while i tried to run it.
export class Visual implements IVisual {
private target: HTMLElement;
private barDataPoints: nodeTreeViewPoints[];
private host: IVisualHost;
private svg: d3.Selection<SVGElement>;
private barContainer: d3.Selection<SVGElement>;
private xAxis: d3.Selection<SVGElement>;
private selectionManager: ISelectionManager;
static Config = {
xScalePadding: 0.1,
solidOpacity: 1,
transparentOpacity: 0.5,
margins: {
top: 0,
right: 0,
bottom: 25,
left: 30,
},
xAxisFontMultiplier: 0.04,
};
constructor(options: VisualConstructorOptions) {
this.host = options.host;
this.selectionManager = options.host.createSelectionManager();
console.log("aaaaa111");
this.svg = d3.select(options.element);
let svg = this.svg;
console.log("aaaaa");
this.barContainer = svg.append('g')
.classed('nodeGraphArea', true);
this.xAxis = svg.append('g')
.classed('xAxis', true);
}
the "aaaa " never prints on the console.
Based on my test, you could use the following script to workaround this situation.
private window: any; constructor(options: VisualConstructorOptions) { this.window = window; this.svg = this.window.d3.select(options.element);
Based on my test, you could use the following script to workaround this situation.
private window: any; constructor(options: VisualConstructorOptions) { this.window = window; this.svg = this.window.d3.select(options.element);
Hi I have recently started working on power custom visualization.
While working on .ts file looking at the examples my d3.select is not working.
What could be the poosible reason for it?
I have imported the typings for d3 and included in the file structure. But its still not working and it shows no error while i tried to run it.
export class Visual implements IVisual {
private target: HTMLElement;
private barDataPoints: nodeTreeViewPoints[];
private host: IVisualHost;
private svg: d3.Selection<SVGElement>;
private barContainer: d3.Selection<SVGElement>;
private xAxis: d3.Selection<SVGElement>;
private selectionManager: ISelectionManager;
static Config = {
xScalePadding: 0.1,
solidOpacity: 1,
transparentOpacity: 0.5,
margins: {
top: 0,
right: 0,
bottom: 25,
left: 30,
},
xAxisFontMultiplier: 0.04,
};
constructor(options: VisualConstructorOptions) {
this.host = options.host;
this.selectionManager = options.host.createSelectionManager();
console.log("aaaaa111");
this.svg = d3.select(options.element);
let svg = this.svg;
console.log("aaaaa");
this.barContainer = svg.append('g')
.classed('nodeGraphArea', true);
this.xAxis = svg.append('g')
.classed('xAxis', true);
}
the "aaaa " never prints on the console.