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

Message ListMessage List     Post MessagePost Message

  Track Line with Data Labels NOT WORKING
Posted by omkar on Feb-19-2014 21:04
i want running sample for track line with data label please help me out, urgently
i am sending the code which i have got from
"http://www.advsofteng.com/doc/cdcomdoc/tracklabelweb.htm" site

i am getting error on "Set r = cd.RanSeries(127)" line can you please help me out.

Code :-



<%@ language="vbscript" %>
<%

<!--#include File="new_autoqry100ctr.vbs"-->

Set cd = CreateObject("ChartDirector.API")

'Data for the chart as 3 random data series

Set r = cd.RanSeries(127)
response.Write("HI")
data0 = r.getSeries(100, 100, -15, 15)
data1 = r.getSeries(100, 150, -15, 15)
data2 = r.getSeries(100, 200, -15, 15)

timeStamps = r.getDateSeries(100, DateSerial(2011, 1, 1), 86400)

' Create a XYChart object of size 640 x 400 pixels
Set c = cd.XYChart(640, 400)

' Add a title to the chart using 18 pts Times New Roman Bold Italic font
Call c.addTitle("Product Line Global Revenue", "timesbi.ttf", 18)

' Set the plotarea at (50, 55) with width 70 pixels less than chart width, and height 90
pixels less
' than chart height. Use a vertical gradient from light blue (f0f6ff) to sky blue (a0c0ff) as
' background. Set border to transparent and grid lines to white (ffffff).
Call c.setPlotArea(50, 55, c.getWidth() - 70, c.getHeight() - 90, c.linearGradientColor(0,
55, 0, _
     c.getHeight() - 35, &Hf0f6ff, &Ha0c0ff), -1, cd.Transparent, &Hffffff, &Hffffff)

' Add a legend box at (50, 25) using horizontal layout. Use 10pts Arial Bold as font. Set
the
' background and border color to Transparent.
Call c.addLegend(50, 25, False, "arialbd.ttf", 10).setBackground(cd.Transparent)

' Set axis label style to 8pts Arial Bold
Call c.xAxis().setLabelStyle("arialbd.ttf", 8)
Call c.yAxis().setLabelStyle("arialbd.ttf", 8)

' Set the axis stem to transparent
Call c.xAxis().setColors(cd.Transparent)
Call c.yAxis().setColors(cd.Transparent)

' Configure x-axis label format
Call c.xAxis().setMultiFormat(cd.StartOfYearFilter(), "{value|mm/yyyy} ",
cd.StartOfMonthFilter(), _
    "{value|mm}")

' Add axis title using 10pts Arial Bold Italic font
Call c.yAxis().setTitle("USD millions", "arialbi.ttf", 10)

' Add a line layer to the chart using a line width of 2 pixels.
Set layer = c.addLineLayer2()
Call layer.setLineWidth(2)

' Add 3 data series to the line layer
Call layer.setXData(timeStamps)
Call layer.addDataSet(data0, &Hff3333, "Alpha")
Call layer.addDataSet(data1, &H008800, "Beta")
Call layer.addDataSet(data2, &H3333cc, "Gamma")

' Create the WebChartViewer object
Set viewer = cd.WebChartViewer(Request, "chart1")

' Output the chart
chartQuery = c.makeSession(Session, viewer.Id)

' Set the chart URL to the viewer
viewer.ImageUrl = "getchart.asp?" & chartQuery

' Output Javascript chart model to the browser to support tracking cursor
viewer.ChartModel = c.getJsChartModel()
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>Track Line with Data Labels</title>
    <script type="text/javascript" src="cdjcv.js"></script>
</head>
<body style="margin:5px 0px 0px 5px">
<script type="text/javascript">

//
// Use the window load event to set up the MouseMovePlotArea event handler
//
JsChartViewer.addEventListener(window, 'load', function() {
    var viewer = JsChartViewer.get('<%=viewer.Id%>');

    // Draw track cursor when mouse is moving over plotarea. Hide it when mouse leaves
plot area.
    viewer.attachHandler("MouseMovePlotArea", function(e) {
        trackLineLabel(viewer, viewer.getPlotAreaMouseX());
        viewer.setAutoHide("all", "MouseOutPlotArea");
    });
});

//
// Draw track line with data labels
//
function trackLineLabel(viewer, mouseX)
{
    // Remove all previously drawn tracking object
    viewer.hideObj("all");

    // The chart and its plot area
    var c = viewer.getChart();
    var plotArea = c.getPlotArea();

    // Get the data x-value that is nearest to the mouse, and find its pixel coordinate.
    var xValue = c.getNearestXValue(mouseX);
    var xCoor = c.getXCoor(xValue);

    // Draw a vertical track line at the x-position
    viewer.drawVLine("trackLine", xCoor, plotArea.getTopY(), plotArea.getBottomY(),
"black 1px dotted");

    // Draw a label on the x-axis to show the track line position
    viewer.showTextBox("xAxisLabel", xCoor, plotArea.getBottomY() + 4,
JsChartViewer.Top,
        c.xAxis().getFormattedLabel(xValue, "mmm dd, yyyy"),
        "font:bold 11px Arial;color:#FFFFFF;background-color:#000000;padding:0px 3px");

    // Iterate through all layers to draw the data labels
    for (var i = 0; i < c.getLayerCount(); ++i)
    {
        var layer = c.getLayerByZ(i);

        // The data array index of the x-value
        var xIndex = layer.getXIndexOf(xValue);

        // Iterate through all the data sets in the layer
        for (var j = 0; j < layer.getDataSetCount(); ++j)
        {
            var dataSet = layer.getDataSetByZ(j);

            // Get the color and position of the data label
            var color = dataSet.getDataColor();
            var yCoor = c.getYCoor(dataSet.getPosition(xIndex), dataSet.getUseYAxis());

            // Draw a track dot with a label next to it for visible data points in the plot area
            if ((yCoor != null) && (yCoor >= plotArea.getTopY()) && (yCoor <=
plotArea.getBottomY()) &&
                (color != null))
            {
                viewer.showTextBox("dataPoint" + i + "_" + j, xCoor, yCoor,
JsChartViewer.Center,
                    viewer.htmlRect(7, 7, color));

                viewer.showTextBox("dataLabel" + i + "_" + j, xCoor + 5, yCoor,
JsChartViewer.Left,
                    dataSet.getValue(xIndex).toPrecision(4),
                    "padding:0px 3px;font:bold 10px Arial;background-color:" + color +
";color:#FFFFFF");
            }
        }
    }
}

</script>
<div style="font-size:18pt; font-family:verdana; font-weight:bold">
    Track Line with Data Labels
</div>
<hr style="border:solid 1px #000080" />
<div style="font-size:10pt; font-family:verdana; margin-bottom:1.5em">
    <a href="viewsource.asp?file=<%=Request("SCRIPT_NAME")%>">View Source
Code
</div>
<!-- ****** Here is the chart image ****** -->
<%=viewer.renderHTML()%>

</body>
</html>

  Re: Track Line with Data Labels NOT WORKING
Posted by Peter Kwan on Feb-19-2014 23:29
Hi omkar,

Are you using ChartDirector version 5.1 or an earlier version? Programmable Track Cursors is
a new feature introduced in ChartDirector version 5.1. It would not work in earlier versions
of ChartDirector.

To determine your ChartDirector version, please try the "ChartDirector/aspdemo/cdinfo.asp"
script that comes with ChartDirector. It will display the ChartDirector version you are using
(as well as some other diagnostic information).

Regards
Peter Kwan

  Re: Track Line with Data Labels NOT WORKING
Posted by omkar on Feb-21-2014 13:07
Thank you Peter Kwan

  Re: Track Line with Data Labels NOT WORKING
Posted by omkar on Feb-21-2014 13:27
Hi Peter Kwan I am using ChartDirector Version : 5.0.2

i have licence key of that version can i upgrade latest version with that licence key ?

Please help me out

  Re: Track Line with Data Labels NOT WORKING
Posted by Peter Kwan on Feb-21-2014 23:33
Hi omkar,

Upgrade from ChartDirector 5.0.2 to 5.1.1 is free of charge. Your existing license key should
continue to with with ChartDirector 5.1.1. You may download the latest version from our
web site.

Regards
Peter Kwan