SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    prototype: help on computing the placement of flowchart elements

    hi guys we're doing a project wherein we have to write the code for the placement of flowchart elements. there is just one problem with the sorting of the elements.

    ideally, it should look like this:


    but right now it looks like this:


    attached is the code. and the function that causes the boxes to sort wrong is this:
    Code JavaScript:
    	shiftDownElements: function(currentY){
    		this.elementsWithPositions.each(function(element){
    			var parallelProcess = this.getParallelElements(this._currentElement);
    			var tempPos = {};
     
    				if (element.value.Y >= currentY) {
    						debugger;
    						tempPos.X = element.value.X;
    						tempPos.Y = element.value.Y + this._flowchart.ELEMENTHEIGHT + this._flowchart.SPACEBTWELEMENT;
    						this.elementsWithPositions.set(element.key, tempPos);
    					}
    		}, this);
    	},

    anyone help?
    Attached Images Attached Images
    Attached Files Attached Files

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,707
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by tuned_in View Post
    anyone help?
    Possibly, if I can recreate the bad flowchart in my web browser.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry if it isnt visually appealing, our main concern right now really is to get the placement correct. is there anything else i need to post to make it easier for you guys?

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,707
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by tuned_in View Post
    sorry if it isnt visually appealing, our main concern right now really is to get the placement correct. is there anything else i need to post to make it easier for you guys?
    A link to a test page, so that we can experience it in our own web browser.

    Either that, or enough information (html + css + js) for us to recreate it in our own machine.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok here you go. the shiftDownElements function i mentioned is on the FlowChartElementsManager2.js file. the flowcharts themselves are just boxes when you view it, we're determining the placements of the boxes thru firebug.
    Attached Files Attached Files

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,707
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    There seems to be a script file missing from your zip, FlowChartElementsManager.js
    Is that file necessary?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi, no it isnt, i forgot to remove it from the index.html file, please ignore it hehe.

  8. #8
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,707
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    The shiftDownElements gets handed elements in this order:
    A9, A10, A11, A5, A6, A7, A8

    When A9 is shifted down to make room for A10, that causes A9 to be below A10

    I presume that you need the elements passed to that function in this order?
    A11, A10, A9, A8, A7, A6, A5
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  9. #9
    SitePoint Member
    Join Date
    Mar 2011
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ^hi yes that is correct. i need them to be sorted in an ascending way.

  10. #10
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,707
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    So it seems that this function is where the attention should be focused on. Right?

    Code javascript:
     
    arrangeData: function(data){
        var newData = $A();
        var newHash = $H();
        data.each(function(element){
            newData.push(element.key);
            newData.push(element.value.to);
        }, this);
        newData = newData.flatten().uniq().compact();
        newData.each(function(item){
            newHash.set(item, this._elementsWithRelations.get(item));
        }, this);
        return newHash;
    },

    Were you aware that objects like Hash sets, cannot guarantee to maintain the relative ordering of its objects?

    From the Quirksmode - Associative page.

    Note that JavaScript doesn't guarantee any particular order for the properties. So you cannot expect the property that was defined first to appear first, it might come last.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

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