Forum Discussion

ngann93's avatar
ngann93
Frequent Visitor
9 years ago
Solved

d3.select not working

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 i...
  • ngann93's avatar
    9 years ago

    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.

  • v-chuncz-msft's avatar
    9 years ago

    ngann93,

     

    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);