Results 1 to 1 of 1

Thread: Creating Custom Nodes Using D3 Adaptor

  1. #1
    Sencha User
    Join Date
    Mar 2017
    Posts
    1

    Default Creating Custom Nodes Using D3 Adaptor

    Hello I am new to Ext JS and D3 and am wondering how I can create custom nodes by extending the D3 HorizontalTree object in the D3 adaptor. My code for the tree is:

    Code:
    Ext.define('WorkflowWidget.view.FlourishTree', {
        extend: 'Ext.d3.hierarchy.tree.HorizontalTree',
    
    
        xtype: 'flourishTree',
    
    
        setupScene: function (){
            this.callParent(arguments);
        },
    
    
        addNodes: function (selection) {
    
    
            selection.append('rect')
                .attr('x', '-45px')
                .attr('y', '-45px')
                .attr('width', '90px')
                .attr('height', '90px')
                .style('fill', '#7F90FC');
    
    
            selection.append("text")
                .attr("x", 10)
                .attr("y", -8)
                .attr("dy", ".35em")
                .text("test")
        },
    
    
        updateNodes: function (update, enter){
            var selection = Ext.Object.merge(update, enter);
    
            selection
                .transition(this.layoutTransition)
                .attr('opacity', 1)
                .call(this.getNodeTransform());
        }
    
    });
    I would like the text to be inside of the blue rectangle but I can't seem to get that to work.

    Thanks for your help!
    Chris
    Attached Images Attached Images

Similar Threads

  1. [FIXED] Blank Nodes When Creating Directories
    By existdissolve in forum Sencha Fiddle
    Replies: 3
    Last Post: 24 Aug 2013, 8:42 PM
  2. jquery adaptor error
    By cc96ai in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 1 Oct 2008, 3:06 PM
  3. Creating Text Nodes
    By pilotjohn in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 15 Jan 2008, 6:23 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •