ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  Stacked bar graph - label or bar as a Link
Posted by steve on Mar-31-2014 07:38
On the stacked bar graph, is there a way to make the x-axis label be a link? Also, is there any way to make the bar in the graph be a clickable link?
Any help would be greatly appreciated!!

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Mar-31-2014 08:10
By the way, I tried adding <a href='xxx.asp'>label</a> into the labels array where I want the link to be but that did not work. I would be very grateful for any help! Thank you!

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-01-2014 03:28
Also, I only need to add a link to just one of the labels on the x-axis. I've searched other threads but I cannot yet determine a solution. Any help would be super appreciated.

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-02-2014 00:23
Hi steve,

Sorry for the late reply.

In HTML, the <area> tag should be used to define a clickable region on the chart image
(the <a> tag is only for HTML text). You can use Axis.getHTMLImageMap to ask
ChartDirector to automatically generate <area> tags for all the axis labels. You can
configure ChartDirector so that only one of the labels is clickable.

From your message, I assume you are using classical ASP with ChartDirector for
ASP/COM/VB. With classical ASP, please refer to the sample code "Simple Clickable
Charts" on how to add an image map to a chart to make parts of it clickable.

In the "Simple Clickable Charts" example, it is making the bars clickable in a bar chart.
The code in the example is:

imageMap = c.getHTMLImageMap("clickline.asp", "", "title='{xLabel}: US$ {value|0}M'")

If you want to make one of the axis labels clickable,  you can create an array of URLs,
one for each label. The array can contain empty URLs for labels that should not be
clickable. It is like:

labelURLs = Array("", "", "aaa.asp", "", "", ....)

Then you can use:

Call c.addExtraField(labelURLs)
imageMap = c.xAxis().getHTMLImageMap("{field0}", " ", "")

If you want both the bars and the axis labels to be clickable, you can concatenate the
various image maps together.

Hope this can help.

Regards
Peter Kwan

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-03-2014 00:53
Thank you very much for your help!
Does this approach work when I simply want to be able to click on a graph and have it go to a completely separate page? For example, I want to be able to click on a label or a bar and have it go to someotherpage.asp?info=myinfo. I need to be able to go to completely separate independent page that has some tables of information. Does this make sense?
I'm having trouble understanding the example. Is "clickline.asp" in the example the name of the file that contains the graph? Sorry, I'm sort of a beginner.
Thanks again!!

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-03-2014 03:03
Hi Steve,

In the original "Simple Clickable Charts" sample code, the first chart is a "Clickable Bar Chart"
(clickbar.asp). The "Clickable Bar Chart" is configured so that the bars are clickable. When
any of the bar is clicked, the browser will jump to a URL like "clickline.asp?
x=7&xLabel=2003&dataSet=7&dataSetName=&value=1950".

So in brief, the "clickline.asp" is the path part of the URL that the browser will jump to when
a bar is clicked. ChartDirector will automatically include query parameters to the URL so you
can distinguish which bar is being clicked. In the sample code, the "clickline.asp" will draw a
different line chart depending on the which bar is clicked. You can modify a "clickline.asp" to
display different tables depending on which bar is clicked.

Note that the sample code uses the same URL path "clickline.asp" to handle all the bars,
and distinguish the bars with query parameters. In your message, you mentioned you want
to have "completely separate independent page". I am not too sure the exact format of the
URL you need. It is possible to create "completely separate independent page" using the
same URL path with different query parameters, or you can use URLs with different path. If
you would prefer the latter method, you would need to use the approach in my last
message - to create an array of URLs, add them as extra fields, and use {field0} as the URL
parameter in getHTMLImageMap. ChartDirector will substitute {field0} with the array
elements when generating the image map.

Hope this can help.

Regards
Peter Kwan

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-04-2014 00:00
I cannot thank you enough for your help. The support here is superb.
However, I'm still having trouble getting this to work. Could it be that my problem is that I have multiple graphs on one page? I have an asp page that displays multiple graphs using the code <img src="stackedbar1.asp?value1=xxx&value2=xxx&...."/>, for example, for each one. The page has displays eight different graphs, a combination of stacked bar charts and Semi-Circle Meter charts each displaying information for a different categories. The code for the graphs is in separate files, stackedbar1.asp, stackedbar2.asp, etc...
Would this somehow make a difference or does it not matter?
Thanks you immensely for your help!

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-04-2014 05:02
Hi Steve,

In your existing code, I suppose it is like:

<html><body>
Some HTML here
<img src="stackedbar1.asp?value1....">
<img src="stackedbar2.asp?value1....">
....
</body></html>

When your execute the above script, the "stackbar1.asp" is not executed at all. The
entire URL is just sent to the browser. When the browser receives your HTML, it will use
a separate HTTP connection to load the "stackbar1.asp". At that time, the server will
execute "stackbar1.asp". That means the server will not create the chart until the HTML
is sent to the browser.

To have a clickable chart, the <AREA> tags must be in the HTML. But it is impossible for
the above HTML code to create the <AREA> tags, because the "stackbar1.asp" is not
executed at all. When the "stackbar1.asp" is eventually executed, the HTML has already
been sent to the browser and therefore cannot be modified. It means with the above
structure, it is not possible to create clickable charts.

Instead, a clcikable chart needs to be created with something like:

<html><body>
Some HTML here

<%
... create stacked bar ...

' store the URL and imageMap into variables ....
chart1URL = c.makeSession(Session, "chart1")
imageMap1 = c.getHTMLImageMap(.......)
%>
<img src="getchart.asp?<%=chart1URL%>" border="0" usemap="#map1">
<map name="map1">
<%=imageMap1%>
</map>


<%
... create another stacked bar ...

' store the URL and imageMap into variables ....
chart2URL = c2.makeSession(Session, "chart2")
imageMap2 = c2.getHTMLImageMap(.......)
%>
<img src="getchart.asp?<%=chart2URL%>" border="0" usemap="#map2">
<map name="map2">
<%=imageMap2%>
</map>

........

</body></html>


Note that in the above, the chart is created in the HTML part of the code. This allows
the image map to be inserted in HTML. The "getchart.asp" is a script that comes with
ChartDirector. It is used to load the image chart from session variables. (It is not
executed until the browser receives the HTML and sends the request to the server to
load the image.)

If you like, you can put the charting code into separate files, and include them using the
#include directive.

Hope this can help.

Regards
Peter Kwan

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-05-2014 02:28
That's it!! THANK YOU!! Absolutely top notch support!!! THANK YOU!!

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-05-2014 02:37
Sorry, one more question. I have it working but I only need one of the bars to be clickable. Is this possible to have just one of the bars be clickable?
Thank you again!

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-05-2014 07:09
Hi Steve,

Yes. You can use the same method I mentioned in my earlier message for axis labels. First,
create an array of URLs, one for each bar. If a bar should not be clickable, just leave the
URL empty:

labelURLs = Array("", "", "aaa.asp", "", "", ....)

Then for the image map, you can use:

Call c1.addExtraField(labelURLs)
imageMap1 = c1.getHTMLImageMap("{field0}", " ", "")

(Note that the second parameter to getHTMLImageMap is not an empty string. It is a space
character. Also, the above assume the only layer in your chart is the bar chart layer.)

Hope this can help.

Regards
Peter Kwan

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-06-2014 01:00
Thank you so much! This will be the last question! I'm just having trouble getting this last part to work.
I have 6 bars. Each bar changes changes from red to yellow to green depending on if it reaches a target number using:
Call layer.addDataSet(data0, &Hff8080, "Bad")
Call layer.addDataSet(data1, &Hffff00, "OK")
Call layer.addDataSet(data2, &H80ff80, "Good")
Call layer.setAggregateLabelStyle()

I only need the 5th bar to be clickable so I am using:
labelURLs = Array("", "", "", "", "dlist.asp", "")

Then for the image map you gave the example:
Call c1.addExtraField(labelURLs)
imageMap1 = c1.getHTMLImageMap("{field0}", " ", "")

I've tried playing around with this but cannot get it working. Is {field0} supposed to be substituted with something else? I'm not sure what parameters are needed here to get your example working.

Thank you immensely!

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-08-2014 00:58
Attachments:
Hi steve,

I have attached a complete example for your reference. You may try it to see if it works in
your machine. (Note that the example requires "getchart.asp" to be in the same directory as
the example script.)

If the above example works, but in your actual code does not work, is it possible to create
an example as well (by using hard coded data), so that I can test your code?

Regards
Peter Kwan
clickbar.asp
clickbar.asp

2.17 Kb

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-08-2014 03:05
FANTASTIC!!
Thank you a million times over!
I'm not sure what I was missing the first time but it's working now!
Thank you again!!

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-08-2014 10:18
Don't kill me but I have just one (yes it will be one) last question. Is there a way to decode the url that is produced when a url within the labelURLs array has parameters? For example, I have
labelURLs = Array("", "", "", "", "", "dlist.asp?Ld='y'")
The URL of the page it tries to go to is:
dlist.asp%3FLd%3D'y'
How might I get to go to dlist.asp?Ld='y'

Thank  you ever so much!

  Re: Stacked bar graph - label or bar as a Link
Posted by Peter Kwan on Apr-08-2014 22:38
Hi Steve,

Instead of {field0}, you may try:

{noescape_url}{field0}

The above disables escaping special characters in URL.

Hope this can help.

Regards
Peter Kwan

  Re: Stacked bar graph - label or bar as a Link
Posted by steve on Apr-09-2014 03:25
Perfect! Thank you again for your outstanding support!