Loading ...
Sorry, an error occurred while loading the content.

Re: getBBox in firefox problem

Expand Messages
  • johnbaronreid1972
    ... visibility:hidden does indeed work for me. I still don t know why the display:none didn t though. Unfortunately in my document I can have of the order of
    Message 1 of 15 , Jan 3, 2008
    • 0 Attachment
      --- In svg-developers@yahoogroups.com, "longsonr" <longsonr@...> wrote:
      > In firefox things that are display:none don't have bounding boxes.
      > visibility:hidden might work for you depending on what you want to
      > achieve.

      visibility:hidden does indeed work for me. I still don't know why the
      display:none didn't though.

      Unfortunately in my document I can have of the order of 1000 of these
      elements that I need to hide/display based on mouse clicks. The
      solution using visibility:hidden seems much slower on firefox and ASV6
      than the display:none method was on ASV6. The example I posted was
      just for test, in my real document each of the elements contains
      several other complicated elements. It appears they really slow the
      implementation down. Any other ideas for how I can get it to work with
      display:none?

      Thanks,
      John.
    • Andreas Neumann
      Hi John, there are actually only one problem with firefox and bounding-boxes: * Firefox 1.5 and 2 had a bug where .getBBox() could not be called onload . One
      Message 2 of 15 , Jan 3, 2008
      • 0 Attachment
        Hi John,

        there are actually only one problem with firefox and bounding-boxes:

        * Firefox 1.5 and 2 had a bug where .getBBox() could not be called
        "onload". One had to do a slight delay, using setTimeout() with a few
        milliseconds. This is corrected in Firefox3 though.

        Other than that Firefox is correct when not returning bounding-boxes
        when display is set to none. The difference between display=none and
        visibility=hidden is that with visibility, the elements are part of
        the rendering tree, while with display=none they are not. For
        elements that aren't part of the rendering tree it is impossible to
        calculate bounding boxes. The same applies for newly created elements
        that haven't been appended to the DOM tree.

        Hope this helps,
        Andreas

        --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
        <johnbaronreid1972@...> wrote:
        >
        > Hi,
        >
        > I can't get the following code to work in firefox. ASV6 seems to
        have
        > no problems. I imagine I've got something to do with namespaces
        wrong
        > but I can't figure out what it is. Under firefox I get the following
        > error when getBBox() is called:
        >
        > Error: uncaught exception: [Exception... "Component returned failure
        > code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMSVGLocatable.getBBox]"
        > nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame ::
        > file:///C:/Dev/MyProjects/Bio/svg/bbox_test.svg :: on_event :: line
        > 30" data: no]
        >
        > Any help would be much appreciated. I looked at
        > http://wiki.svg.org/GetBBox and tried to follow the advice there.
        >
        > Thanks,
        > John.
        >
        >
        >
        > The svg is:
        >
        > <?xml version="1.0" encoding="UTF-8" standalone="no" ?>
        > <svg
        > xmlns="http://www.w3.org/2000/svg"
        > baseProfile="full"
        > onload="init(evt);"
        > preserveAspectRatio="xMidYMid"
        > version="1.1"
        > viewBox="0 0 150 130"
        > xmlns:ev="http://www.w3.org/2001/xml-events"
        > xmlns:xlink="http://www.w3.org/1999/xlink">
        >
        > <script type="text/javascript"><![CDATA[
        > var svgNS = "http://www.w3.org/2000/svg";
        > var doc = null;
        > var root = null;
        >
        > function init(evt)
        > {
        > doc = evt.target.ownerDocument;
        > root = doc.documentElement;
        > };
        >
        > function on_event()
        > {
        > var hit_info = doc.getElementById('info');
        > if( null == hit_info ) alert('Could not find: info');
        > else {
        > var back = doc.getElementById('back');
        > if (toggle_display(hit_info)) {
        > var outline = hit_info.getBBox();
        > back.setAttribute('x', outline.x -
        1.5);
        > back.setAttribute('y', outline.y -
        1.5);
        > back.setAttribute('width',
        outline.width + 3);
        > back.setAttribute('height',
        outline.height + 3);
        > back.setAttribute('display',
        'inline');
        > } else {
        > back.setAttribute('display', 'none');
        > }
        > }
        > }
        >
        > function toggle_display(el)
        > {
        > if ('none' == el.getAttribute('display')) {
        > el.setAttribute('display', 'inline');
        > return true;
        > } else {
        > el.setAttribute('display', 'none');
        > return false;
        > }
        > };
        > ]]></script>
        >
        > <circle id="hit" cx="50" cy="50" fill="white"
        onclick="on_event()"
        > r="2" stroke="black" stroke-width="0.3"/>
        > <rect id="back" display="none" fill="lightgray" rx="0.3"
        > stroke="lightgray" stroke-width="0.3"/>
        > <rect id="info" display="none" fill='green' x='5' y='5'
        width='20'
        > height='10'/>
        > </svg>
        >
      • johnbaronreid1972
        ... I m afraid it doesn t help. My element has display:none initially then I set display to inline in the javascript then I call getBBox which throws an error.
        Message 3 of 15 , Jan 3, 2008
        • 0 Attachment
          --- In svg-developers@yahoogroups.com, "Andreas Neumann" <neumann@...>
          wrote:
          >
          > Hi John,
          >
          > there are actually only one problem with firefox and bounding-boxes:
          >
          > * Firefox 1.5 and 2 had a bug where .getBBox() could not be called
          > "onload". One had to do a slight delay, using setTimeout() with a few
          > milliseconds. This is corrected in Firefox3 though.
          >
          > Other than that Firefox is correct when not returning bounding-boxes
          > when display is set to none. The difference between display=none and
          > visibility=hidden is that with visibility, the elements are part of
          > the rendering tree, while with display=none they are not. For
          > elements that aren't part of the rendering tree it is impossible to
          > calculate bounding boxes. The same applies for newly created elements
          > that haven't been appended to the DOM tree.
          >
          > Hope this helps,
          > Andreas
          >
          I'm afraid it doesn't help. My element has display:none initially then
          I set display to inline in the javascript then I call getBBox which
          throws an error. I don't think I am doing anything wrong. Please let
          me know if I am.

          John.
        • longsonr
          ... wrote: You are not doing anything wrong. You are suffering from https://bugzilla.mozilla.org/show_bug.cgi?id=339807 This was fixed
          Message 4 of 15 , Jan 3, 2008
          • 0 Attachment
            --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
            <johnbaronreid1972@...> wrote:

            You are not doing anything wrong. You are suffering from
            https://bugzilla.mozilla.org/show_bug.cgi?id=339807

            This was fixed during the Firefox 3 development cycle. A workaround
            would be to use setTimeout as Andreas suggests.

            Best regards

            Robert.

            >
            > --- In svg-developers@yahoogroups.com, "Andreas Neumann" <neumann@>
            > wrote:
            > >
            > > Hi John,
            > >
            > > there are actually only one problem with firefox and bounding-boxes:
            > >
            > > * Firefox 1.5 and 2 had a bug where .getBBox() could not be called
            > > "onload". One had to do a slight delay, using setTimeout() with a few
            > > milliseconds. This is corrected in Firefox3 though.
            > >
            > > Other than that Firefox is correct when not returning bounding-boxes
            > > when display is set to none. The difference between display=none and
            > > visibility=hidden is that with visibility, the elements are part of
            > > the rendering tree, while with display=none they are not. For
            > > elements that aren't part of the rendering tree it is impossible to
            > > calculate bounding boxes. The same applies for newly created elements
            > > that haven't been appended to the DOM tree.
            > >
            > > Hope this helps,
            > > Andreas
            > >
            > I'm afraid it doesn't help. My element has display:none initially then
            > I set display to inline in the javascript then I call getBBox which
            > throws an error. I don't think I am doing anything wrong. Please let
            > me know if I am.
            >
            > John.
            >
          • johnbaronreid1972
            ... Right - now I see that the bug report mentions that it can happen outside the onload event(). That was confusing as I m definitely not doing anything in
            Message 5 of 15 , Jan 3, 2008
            • 0 Attachment
              --- In svg-developers@yahoogroups.com, "longsonr" <longsonr@...> wrote:
              >
              > --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
              > <johnbaronreid1972@> wrote:
              >
              > You are not doing anything wrong. You are suffering from
              > https://bugzilla.mozilla.org/show_bug.cgi?id=339807
              >
              > This was fixed during the Firefox 3 development cycle. A workaround
              > would be to use setTimeout as Andreas suggests.
              >
              Right - now I see that the bug report mentions that it can happen
              outside the onload event(). That was confusing as I'm definitely not
              doing anything in the onload event.

              Thanks for the help,
              John.
            • longsonr
              ... I think you are confusing the bug I mentioned with the onload bug that Andreas mentioned previously. There are (at least) two different bugs with GetBBox
              Message 6 of 15 , Jan 3, 2008
              • 0 Attachment
                --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
                <johnbaronreid1972@...> wrote:
                >
                > --- In svg-developers@yahoogroups.com, "longsonr" <longsonr@> wrote:
                > >
                > > --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
                > > <johnbaronreid1972@> wrote:
                > >
                > > You are not doing anything wrong. You are suffering from
                > > https://bugzilla.mozilla.org/show_bug.cgi?id=339807
                > >
                > > This was fixed during the Firefox 3 development cycle. A workaround
                > > would be to use setTimeout as Andreas suggests.
                > >
                > Right - now I see that the bug report mentions that it can happen
                > outside the onload event(). That was confusing as I'm definitely not
                > doing anything in the onload event.

                I think you are confusing the bug I mentioned with the onload bug that
                Andreas mentioned previously. There are (at least) two different bugs
                with GetBBox in firefox 2 a) it doesn't work onload b) it doesn't work
                immediately after you change things. SetTimeout should be able to work
                around both.

                Robert.
                >
                > Thanks for the help,
                > John.
                >
              • johnbaronreid1972
                ... I did have the right end of the stick even though my badly worded email suggested otherwise. Thanks for the clarification. I have another problem now that
                Message 7 of 15 , Jan 4, 2008
                • 0 Attachment
                  --- In svg-developers@yahoogroups.com, "longsonr" <longsonr@...> wrote:

                  > I think you are confusing the bug I mentioned with the onload bug that
                  > Andreas mentioned previously. There are (at least) two different bugs
                  > with GetBBox in firefox 2 a) it doesn't work onload b) it doesn't work
                  > immediately after you change things. SetTimeout should be able to work
                  > around both.

                  I did have the right end of the stick even though my badly worded
                  email suggested otherwise. Thanks for the clarification.

                  I have another problem now that firefox seems to get the bbox wrong.
                  It returns an extremely large width. I'm using <svg> elements with
                  several transforms inside the element I'm calling getBBox on. Is this
                  known to confuse it? I'm on the latest version of Firefox 2. ASV6
                  appears to have no problems. I would post an example but I haven't
                  whittled it down to a test case yet.

                  Best,
                  John.
                • johnbaronreid1972
                  ... Here s a reasonably small test case where the Firefox 2 and ASV6 behaviour differs significantly:
                  Message 8 of 15 , Jan 4, 2008
                  • 0 Attachment
                    --- In svg-developers@yahoogroups.com, "johnbaronreid1972"
                    <johnbaronreid1972@...> wrote:
                    > I have another problem now that firefox seems to get the bbox wrong.
                    > It returns an extremely large width. I'm using <svg> elements with
                    > several transforms inside the element I'm calling getBBox on. Is this
                    > known to confuse it? I'm on the latest version of Firefox 2. ASV6
                    > appears to have no problems. I would post an example but I haven't
                    > whittled it down to a test case yet.

                    Here's a reasonably small test case where the Firefox 2 and ASV6
                    behaviour differs significantly:

                    <?xml version="1.0" encoding="UTF-8" standalone="no" ?>
                    <svg xmlns="http://www.w3.org/2000/svg" baseProfile="full"
                    onload="init(evt);" pointer-events="none"
                    preserveAspectRatio="xMidYMid" version="1.1" viewBox="0 0 140 130"
                    xmlns:ev="http://www.w3.org/2001/xml-events"
                    xmlns:xlink="http://www.w3.org/1999/xlink">

                    <script type="text/javascript">

                    <![CDATA[
                    var svgNS = "http://www.w3.org/2000/svg";
                    var mydoc = null;
                    var root = null;


                    function init(evt)
                    {
                    mydoc = evt.target.ownerDocument;
                    root = mydoc.documentElement;
                    };

                    function show_notes()
                    {
                    var back = mydoc.getElementById('notes_background');
                    try {
                    var outline = notes_panel.getBBox();
                    back.setAttributeNS(null, 'width', Number(outline.width) + 2);
                    back.setAttributeNS(null, 'height', Number(outline.height) + 2);
                    back.setAttributeNS(null, 'x', Number(outline.x) - 1);
                    back.setAttributeNS(null, 'y', Number(outline.y) - 1);
                    } catch (er) {
                    }
                    notes_panel.setAttributeNS(null, 'display', 'inline');
                    }

                    function hide_notes()
                    {
                    notes_panel.setAttributeNS(null, 'display', 'none');
                    }

                    function click_hit(hit_id)
                    {
                    var hit = mydoc.getElementById(hit_id);
                    if( null != hit ) {
                    var parent = hit.parentNode;
                    parent.removeChild(hit);
                    parent.appendChild(hit);
                    }

                    var hit_info = mydoc.getElementById(hit_id + '_info');
                    if( null != hit_info ) {
                    var back = mydoc.getElementById(hit_id + '_info_back');
                    var underlines = mydoc.getElementById(hit_id + '_underlines');
                    if( toggle_visibility(hit_info) ) {
                    if( null != underlines ) underlines.setAttributeNS(null, 'display',
                    'inline');
                    setTimeout('resize_info_outline("'+hit_id+'");', 1);
                    } else {
                    if( null != underlines ) underlines.setAttributeNS(null, 'display',
                    'none');
                    back.setAttributeNS(null, 'width', 0);
                    back.setAttributeNS(null, 'height', 0);
                    back.setAttributeNS(null, 'x', 0);
                    back.setAttributeNS(null, 'y', 0);
                    }
                    }
                    }

                    function resize_info_outline(hit_id) {
                    var back = mydoc.getElementById(hit_id + '_info_back');
                    var hit_info = mydoc.getElementById(hit_id + '_info');
                    var outline = hit_info.getBBox();
                    back.setAttributeNS(null, 'width', Number(outline.width) + 2);
                    back.setAttributeNS(null, 'height', Number(outline.height) + 2);
                    back.setAttributeNS(null, 'x', Number(outline.x) - 1);
                    back.setAttributeNS(null, 'y', Number(outline.y) - 1);
                    }

                    function toggle_visibility(el)
                    {
                    var current = el.getAttributeNS(null, 'display');
                    if ('none' == current) {
                    el.setAttributeNS(null, 'display', 'inline');
                    return true;
                    } else {
                    el.setAttributeNS(null, 'display', 'none');
                    return false;
                    }
                    };

                    ]]>
                    </script>

                    <defs>
                    <g id="A" transform="scale(1.5,1.4)">
                    <text style="text-anchor:start; font-family: arial;
                    fill:chartreuse; font-size:100px">A</text>
                    </g>
                    <g id="C" transform="scale(1.58,1.35) translate(-5,0)">
                    <text style="text-anchor:start; font-family: arial; fill:orange;
                    font-size:100px; baseline-shift:1%">C</text>
                    </g>
                    <g id="G" transform="scale(1.5,1.35) translate(-5,0)">
                    <text style="text-anchor:start; font-family: arial; fill:cyan;
                    font-size:100px; baseline-shift:1%">G</text>
                    </g>
                    <g id="T" transform="scale(1.75,1.4) translate(-2,0)">
                    <text style="text-anchor:start; font-family: arial; fill:red;
                    font-size:100px">T</text>
                    </g>
                    </defs>

                    <g transform="translate(0 20)">
                    <g transform="translate(0)">
                    <g>
                    <g id="hit_19" transform="translate(31.5 47.2035)">
                    <circle fill="#3366FF" onclick="click_hit('hit_19')"
                    pointer-events="visiblePainted" r="2" stroke="black"
                    stroke-width="0.3" x="0" y="0"/>
                    <g display="none" id="hit_19_info"
                    pointer-events="visiblePainted" transform="translate(3 0) scale(.5)
                    translate(0 -17)">
                    <rect fill="white" height="0" id="hit_19_info_back"
                    rx="0.3" stroke="lightgray" stroke-width="0.3" width="0" x="0" y="0"/>
                    <svg height="10" viewBox="0 0 100 200" width="55">
                    <g transform="translate(0 200)">
                    <g transform="translate(0 0) scale(1 0.052198)">
                    <use xlink:href="#T"/>
                    </g>
                    </g>
                    </svg>
                    </g>
                    </g>
                    </g>
                    </g>
                    </g>

                    </svg>
                  • brucerindahl
                    ... I think there are (at least) three. https://bugzilla.mozilla.org/show_bug.cgi?id=293581 is still there - see the last comment. I don t think setTimeout
                    Message 9 of 15 , Jan 4, 2008
                    • 0 Attachment
                      --- In svg-developers@yahoogroups.com, "longsonr" <longsonr@...> wrote:
                      > I think you are confusing the bug I mentioned with the onload bug that
                      > Andreas mentioned previously. There are (at least) two different bugs
                      > with GetBBox in firefox 2 a) it doesn't work onload b) it doesn't work
                      > immediately after you change things. SetTimeout should be able to work
                      > around both.
                      >
                      > Robert.

                      I think there are (at least) three.
                      https://bugzilla.mozilla.org/show_bug.cgi?id=293581
                      is still there - see the last comment. I don't think setTimeout will
                      help this.

                      Bruce
                    Your message has been successfully submitted and would be delivered to recipients shortly.