Rendering Vertical Line In Fusionchart After The Last Column On X Axis

[nikhilpatil]

The following array represents my X-Axis metadata for Fusion Chart (StackedBar2D). My requirement is to render a vertical line if the date is today i.e. current date. (Note: the following data is only partial)

So eg: if today is Wed 30-Aug-2011, I insert a vertical line object in the array. This works fine, a line is appropriately rendered.

However, if today is Wed 31-Aug-2011, I insert the vline object at the end of the array. This time, fusion charts does not render the vertical line.

This page states that vertical line can be placed between any two data points.

I understand that there are no two data points in this case (i.e. vline object is not between two data points) but is there a way to still render the line? I found a hack which is to insert a blank label after thevline object but again, it's a hack, it creates a noticeable blank area at the right end. Is it a limitation that I have to deal with? Any proper solution or a workaround?

 

[
{
"label": "Mon 01-Aug-2011"
},
{
"label": "Tue 02-Aug-2011"
},
{
"label": "Wed 03-Aug-2011"
},
{
"label": "Thu 04-Aug-2011"
},
{
"label": "Fri 05-Aug-2011"
},
{
"label": "Sat 06-Aug-2011"
},
{
"label": "Sun 07-Aug-2011"
},
{
"label": "Mon 08-Aug-2011"
},
{
"label": "Tue 09-Aug-2011"
},
{
"label": "Wed 10-Aug-2011"
},
{
"label": "Thu 11-Aug-2011"
},
{
"label": "Fri 12-Aug-2011"
},
{
"label": "Sat 13-Aug-2011"
},
{
"label": "Sun 14-Aug-2011"
},
{
"label": "Mon 15-Aug-2011"
},
{
"label": "Tue 16-Aug-2011"
},
{
"label": "Wed 17-Aug-2011"
},
{
"label": "Thu 18-Aug-2011"
},
{
"label": "Fri 19-Aug-2011"
},
{
"label": "Sat 20-Aug-2011"
},
{
"label": "Sun 21-Aug-2011"
},
{
"label": "Mon 22-Aug-2011"
},
{
"label": "Tue 23-Aug-2011"
},
{
"label": "Wed 24-Aug-2011"
},
{
"label": "Thu 25-Aug-2011"
},
{
"label": "Fri 26-Aug-2011"
},
{
"label": "Sat 27-Aug-2011"
},
{
"label": "Sun 28-Aug-2011"
},
{
"label": "Mon 29-Aug-2011"
},
{
"label": "Tue 30-Aug-2011"
}, 
{
"label": "Wed 31-Aug-2011"
},
{
"vline": "true",
"thickness": "2",
"dashed": "1",
"linePosition ": "0",
"dashGap": "2"
}
]
 

 

[Sanjukta]

 

The following array represents my X-Axis metadata for Fusion Chart (StackedBar2D). My requirement is to render a vertical line if the date is today i.e. current date. (Note: the following data is only partial)

So eg: if today is Wed 30-Aug-2011, I insert a vertical line object in the array. This works fine, a line is appropriately rendered.

However, if today is Wed 31-Aug-2011, I insert the vline object at the end of the array. This time, fusion charts does not render the vertical line.

This page states that vertical line can be placed between any two data points.

I understand that there are no two data points in this case (i.e. vline object is not between two data points) but is there a way to still render the line? I found a hack which is to insert a blank label after thevline object but again, it's a hack, it creates a noticeable blank area at the right end. Is it a limitation that I have to deal with? Any proper solution or a workaround?

 

[
{
"label": "Mon 01-Aug-2011"
},
{
"label": "Tue 02-Aug-2011"
},
{
"label": "Wed 03-Aug-2011"
},
{
"label": "Thu 04-Aug-2011"
},
{
"label": "Fri 05-Aug-2011"
},
{
"label": "Sat 06-Aug-2011"
},
{
"label": "Sun 07-Aug-2011"
},
{
"label": "Mon 08-Aug-2011"
},
{
"label": "Tue 09-Aug-2011"
},
{
"label": "Wed 10-Aug-2011"
},
{
"label": "Thu 11-Aug-2011"
},
{
"label": "Fri 12-Aug-2011"
},
{
"label": "Sat 13-Aug-2011"
},
{
"label": "Sun 14-Aug-2011"
},
{
"label": "Mon 15-Aug-2011"
},
{
"label": "Tue 16-Aug-2011"
},
{
"label": "Wed 17-Aug-2011"
},
{
"label": "Thu 18-Aug-2011"
},
{
"label": "Fri 19-Aug-2011"
},
{
"label": "Sat 20-Aug-2011"
},
{
"label": "Sun 21-Aug-2011"
},
{
"label": "Mon 22-Aug-2011"
},
{
"label": "Tue 23-Aug-2011"
},
{
"label": "Wed 24-Aug-2011"
},
{
"label": "Thu 25-Aug-2011"
},
{
"label": "Fri 26-Aug-2011"
},
{
"label": "Sat 27-Aug-2011"
},
{
"label": "Sun 28-Aug-2011"
},
{
"label": "Mon 29-Aug-2011"
},
{
"label": "Tue 30-Aug-2011"
}, 
{
"label": "Wed 31-Aug-2011"
},
{
"vline": "true",
"thickness": "2",
"dashed": "1",
"linePosition ": "0",
"dashGap": "2"
}
]
 

Hi,

 

Please try setting the vertical line after the label "30-Aug-2011" with "linePosition" set to '1' in the <vLine> element in the XML.

 

[
        {
          "label": "Mon 01-Aug-2011"
        },
        {
          "label": "Tue 02-Aug-2011"
        },
        {
          "label": "Wed 03-Aug-2011"
        },
        {
          "label": "Thu 04-Aug-2011"
        },
        {
          "label": "Fri 05-Aug-2011"
        },
        {
          "label": "Sat 06-Aug-2011"
        },
        {
          "label": "Sun 07-Aug-2011"
        },
        {
          "label": "Mon 08-Aug-2011"
        },
        {
          "label": "Tue 09-Aug-2011"
        },
        {
          "label": "Wed 10-Aug-2011"
        },
        {
          "label": "Thu 11-Aug-2011"
        },
        {
          "label": "Fri 12-Aug-2011"
        },
        {
          "label": "Sat 13-Aug-2011"
        },
        {
          "label": "Sun 14-Aug-2011"
        },
        {
          "label": "Mon 15-Aug-2011"
        },
        {
          "label": "Tue 16-Aug-2011"
        },
        {
          "label": "Wed 17-Aug-2011"
        },
        {
          "label": "Thu 18-Aug-2011"
        },
        {
          "label": "Fri 19-Aug-2011"
        },
        {
          "label": "Sat 20-Aug-2011"
        },
        {
          "label": "Sun 21-Aug-2011"
        },
        {
          "label": "Mon 22-Aug-2011"
        },
        {
          "label": "Tue 23-Aug-2011"
        },
        {
          "label": "Wed 24-Aug-2011"
        },
        {
          "label": "Thu 25-Aug-2011"
        },
        {
          "label": "Fri 26-Aug-2011"
        },
        {
          "label": "Sat 27-Aug-2011"
        },
        {
          "label": "Sun 28-Aug-2011"
        },
        {
          "label": "Mon 29-Aug-2011"
        },
        {
          "label": "Tue 30-Aug-2011"
        },
        {
          "thickness": "2",
          "dashed": "1",
          "lineposition": "1",
          "dashgap": "2",
          "vline": "true"
        },
        {
          "label": "Wed 31-Aug-2011"
        }
      ]
    }
  ],
 

Hope this helps.

[nikhilpatil]

Hi!

Thanks a lot for the reply! Eventually I took the same approach As suggested by a fellow SO user

I wanted to avoid using specific logic for first or last element of the array. Anyhow, this does work 

[Guest Sumedh]