Path: C:\
<%@ language="vbscript" %>
<%
Set cd = CreateObject("ChartDirector.API")
' The data for the bars and the marks
barData = Array(100, 125, 245, 147, 67, 96, 160, 145, 97, 167, 220, 125)
markData = Array(85, 156, 220, 120, 80, 110, 140, 130, 111, 180, 175, 100)
' The labels for the bar chart
labels = Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sept", _
"Oct", "Nov", "Dec")
' Create a XYChart object of size 480 x 360 pixels. Use a vertical gradient color
' from pale blue (e8f0f8) to sky blue (aaccff) spanning half the chart height as
' background. Set border to blue (88aaee). Use rounded corners. Enable soft drop
' shadow.
Set c = cd.XYChart(480, 360)
Call c.setBackground(c.linearGradientColor(0, 0, 0, c.getHeight() / 2, &He8f0f8, _
&Haaccff), &H88aaee)
Call c.setRoundedFrame()
Call c.setDropShadow()
' Add a title to the chart using 15 points Arial Italic font. Set top/bottom margins
' to 12 pixels.
Set title = c.addTitle("Bars with Marks Demonstration", "ariali.ttf", 15)
Call title.setMargin2(0, 0, 12, 12)
' Tentatively set the plotarea to 50 pixels from the left edge to allow for the
' y-axis, and to just under the title. Set the width to 65 pixels less than the chart
' width, and the height to reserve 90 pixels at the bottom for the x-axis and the
' legend box. Use pale blue (e8f0f8) background, transparent border, and grey
' (888888) dotted horizontal grid lines.
Call c.setPlotArea(50, title.getHeight(), c.getWidth() - 65, c.getHeight() - _
title.getHeight() - 90, &He8f0f8, -1, cd.Transparent, c.dashLineColor(&H888888, _
cd.DotLine))
' Add a legend box where the bottom-center is anchored to the 15 pixels above the
' bottom-center of the chart. Use horizontal layout and 8 points Arial font.
Set legendBox = c.addLegend(c.getWidth() / 2, c.getHeight() - 15, False, _
"arial.ttf", 8)
Call legendBox.setAlignment(cd.BottomCenter)
' Set the legend box background and border to pale blue (e8f0f8) and bluish grey
' (445566)
Call legendBox.setBackground(&He8f0f8, &H445566)
' Use rounded corners of 5 pixel radius for the legend box
Call legendBox.setRoundedCorners(5)
' Use line style legend key
Call legendBox.setLineStyleKey()
' Set axes to transparent
Call c.xAxis().setColors(cd.Transparent)
Call c.yAxis().setColors(cd.Transparent)
' Set the labels on the x axis
Call c.xAxis().setLabels(labels)
' Add a box-whisker layer with just the middle mark visible for the marks. Use red
' (ff0000) color for the mark, with a line width of 2 pixels and 10% horizontal gap
Set markLayer = c.addBoxWhiskerLayer(Empty, Empty, Empty, Empty, markData, -1, _
&Hff0000)
Call markLayer.setLineWidth(2)
Call markLayer.setDataGap(0.1)
' Add the legend key for the mark line
Call legendBox.addKey("Target", &Hff0000, 2)
' Add a blue (0066cc) bar layer using the given data.
Set barLayer = c.addBarLayer(barData, &H0066cc, "Actual")
' Use soft lighting effect for the bars with light direction from left.
Call barLayer.setBorderColor(cd.Transparent, cd.softLighting(cd.Left))
' Adjust the plot area size, such that the bounding box (inclusive of axes) is 10
' pixels from the left edge, just below the title, 15 pixels from the right edge, and
' 10 pixels above the legend box.
Call c.packPlotArea(10, title.getHeight(), c.getWidth() - 15, c.layoutLegend( _
).getTopY() - 10)
' Output the chart
Response.ContentType = "image/png"
Response.BinaryWrite c.makeChart2(cd.PNG)
Response.End
%>