示例#1
0
        /// <summary>
        /// Load the data
        /// </summary>
        private void loadData()
        {
            // In this demo, we allow scrolling for the last 5 years.
            DateTime lastDate  = DateTime.Now.Date;
            DateTime firstDate = DateTime.Now.Date.AddYears(-5);

            // The initial view port is to show 1 year of data.
            currentDuration = lastDate.Subtract(DateTime.Now.Date.AddYears(-1)).TotalSeconds;

            //
            // Get the data and stores them in a memory buffer for fast scrolling / zooming. In
            // this demo, we just use a random number generator. In practice, you may get the data
            // from a database or XML or by other means. (See the ChartDirector documentation on
            // "Using Data Sources with ChartDirector" if you need some sample code on how to read
            // data from database to array variables.)
            //

            // Set up random number generator
            RanTable r = new RanTable(127, 4, lastDate.Subtract(firstDate).Days + 1);

            r.setDateCol(0, firstDate, 86400);
            r.setCol(1, 150, -10, 10);
            r.setCol(2, 200, -10, 10);
            r.setCol(3, 250, -10, 10);

            // Read random data into the data arrays
            timeStamps  = Chart.NTime(r.getCol(0));
            dataSeriesA = r.getCol(1);
            dataSeriesB = r.getCol(2);
            dataSeriesC = r.getCol(3);
        }
        //
        // Create a random table for demo purpose.
        //
        private RanTable getRandomTable()
        {
            RanTable r = new RanTable(127, 4, 1828);

            r.setDateCol(0, new DateTime(2010, 1, 1), 86400);
            r.setCol(1, 150, -10, 10);
            r.setCol(2, 200, -10, 10);
            r.setCol(3, 250, -8, 8);
            return(r);
        }
        //Main code for creating chart.
        //Note: the argument chartIndex is unused because this demo only has 1 chart.
        public void createChart(WPFChartViewer viewer, int chartIndex)
        {
            // Use random table to generate a random series. The random table is set to 1 col x 51
            // rows, with 9 as the seed
            RanTable rantable = new RanTable(9, 1, 51);

            // Set the 1st column to start from 100, with changes between rows from -5 to +5
            rantable.setCol(0, 100, -5, 5);

            // Get the 1st column of the random table as the data set
            double[] data = rantable.getCol(0);

            // Create a XYChart object of size 600 x 300 pixels
            XYChart c = new XYChart(600, 300);

            // Set the plotarea at (50, 35) and of size 500 x 240 pixels. Enable both the horizontal
            // and vertical grids by setting their colors to grey (0xc0c0c0)
            c.setPlotArea(50, 35, 500, 240).setGridColor(0xc0c0c0, 0xc0c0c0);

            // Add a title to the chart using 18 point Times Bold Itatic font.
            c.addTitle("LOWESS Generic Curve Fitting Algorithm", "Times New Roman Bold Italic", 18);

            // Set the y axis line width to 3 pixels
            c.yAxis().setWidth(3);

            // Add a title to the x axis using 12pt Arial Bold Italic font
            c.xAxis().setTitle("Server Load (TPS)", "Arial Bold Italic", 12);

            // Set the x axis line width to 3 pixels
            c.xAxis().setWidth(3);

            // Set the x axis scale from 0 - 50, with major tick every 5 units and minor tick every
            // 1 unit
            c.xAxis().setLinearScale(0, 50, 5, 1);

            // Add a blue layer to the chart
            LineLayer layer = c.addLineLayer2();

            // Add a red (0x80ff0000) data set to the chart with square symbols
            layer.addDataSet(data, unchecked ((int)0x80ff0000)).setDataSymbol(Chart.SquareSymbol);

            // Set the line width to 2 pixels
            layer.setLineWidth(2);

            // Use lowess for curve fitting, and plot the fitted data using a spline layer with line
            // width set to 3 pixels
            c.addSplineLayer(new ArrayMath(data).lowess().result(), 0x0000ff).setLineWidth(3);

            // Set zero affinity to 0 to make sure the line is displayed in the most detail scale
            c.yAxis().setAutoScale(0, 0, 0);

            // Output the chart
            viewer.Chart = c;

            //include tool tip for the chart
            viewer.ImageMap = c.getHTMLImageMap("clickable", "", "title='({x}, {value|2})'");
        }
        //
        // Create chart
        //
        private void createChart(RazorChartViewer viewer)
        {
            // Get the selected year and month
            int selectedYear  = int.Parse(Request["year"]);
            int selectedMonth = int.Parse(Request["x"]) + 1;

            //
            // In real life, the data may come from a database based on selectedYear. In this example, we
            // just use a random number generator.
            //
            int      seed     = (selectedYear - 1992) * (100 + 3 * selectedMonth);
            RanTable rantable = new RanTable(seed, 1, 4);

            rantable.setCol(0, seed * 0.003, seed * 0.017);

            double[] data = rantable.getCol(0);

            // The labels for the pie chart
            string[] labels = { "Services", "Hardware", "Software", "Others" };

            // Create a PieChart object of size 600 x 240 pixels
            PieChart c = new PieChart(600, 280);

            // Set the center of the pie at (300, 140) and the radius to 120 pixels
            c.setPieSize(300, 140, 120);

            // Add a title to the pie chart using 18pt Times Bold Italic font
            c.addTitle("Revenue Breakdown for " + selectedMonth + "/" + selectedYear,
                       "Times New Roman Bold Italic", 18);

            // Draw the pie in 3D with 20 pixels 3D depth
            c.set3D(20);

            // Set label format to display sector label, value and percentage in two lines
            c.setLabelFormat("{label}<*br*>${value|2}M ({percent}%)");

            // Set label style to 10pt Arial Bold Italic font. Set background color to the same as the
            // sector color, with reduced-glare glass effect and rounded corners.
            ChartDirector.TextBox t = c.setLabelStyle("Arial Bold Italic", 10);
            t.setBackground(Chart.SameAsMainColor, Chart.Transparent, Chart.glassEffect(
                                Chart.ReducedGlare));
            t.setRoundedCorners();

            // Use side label layout method
            c.setLabelLayout(Chart.SideLayout);

            // Set the pie data and the pie labels
            c.setData(data, labels);

            // Create the image and save it in a temporary location
            viewer.Image = c.makeWebImage(Chart.PNG);

            // Create an image map for the chart
            viewer.ImageMap = c.getHTMLImageMap(Url.Action("", "piestub"), "",
                                                "title='{label}:US$ {value|2}M'");
        }
        //
        // Create chart
        //
        private void createChart(RazorChartViewer viewer)
        {
            // Create a finance chart demo containing 100 days of data
            int noOfDays = 100;

            // To compute moving averages starting from the first day, we need to get extra data points
            // before the first day
            int extraDays = 30;

            // In this exammple, we use a random number generator utility to simulate the data. We set up
            // the random table to create 6 cols x (noOfDays + extraDays) rows, using 9 as the seed.
            RanTable rantable = new RanTable(9, 6, noOfDays + extraDays);

            // Set the 1st col to be the timeStamp, starting from Sep 4, 2002, with each row representing
            // one day, and counting week days only (jump over Sat and Sun)
            rantable.setDateCol(0, new DateTime(2002, 9, 4), 86400, true);

            // Set the 2nd, 3rd, 4th and 5th columns to be high, low, open and close data. The open value
            // starts from 100, and the daily change is random from -5 to 5.
            rantable.setHLOCCols(1, 100, -5, 5);

            // Set the 6th column as the vol data from 5 to 25 million
            rantable.setCol(5, 50000000, 250000000);

            // Now we read the data from the table into arrays
            double[] timeStamps = rantable.getCol(0);
            double[] highData   = rantable.getCol(1);
            double[] lowData    = rantable.getCol(2);
            double[] openData   = rantable.getCol(3);
            double[] closeData  = rantable.getCol(4);
            double[] volData    = rantable.getCol(5);

            // Create a FinanceChart object of width 640 pixels
            FinanceChart c = new FinanceChart(640);

            // Add a title to the chart
            c.addTitle("Finance Chart Demonstration");

            // Set the data into the finance chart object
            c.setData(timeStamps, highData, lowData, openData, closeData, volData, extraDays);

            // Add a slow stochastic chart (75 pixels high) with %K = 14 and %D = 3
            c.addSlowStochastic(75, 14, 3, 0x006060, 0x606000);

            // Add the main chart with 240 pixels in height
            c.addMainChart(240);

            // Add a 10 period simple moving average to the main chart, using brown color
            c.addSimpleMovingAvg(10, 0x663300);

            // Add a 20 period simple moving average to the main chart, using purple color
            c.addSimpleMovingAvg(20, 0x9900ff);

            // Add candlestick symbols to the main chart, using green/red for up/down days
            c.addCandleStick(0x00ff00, 0xff0000);

            // Add 20 days donchian channel to the main chart, using light blue (9999ff) as the border
            // and semi-transparent blue (c06666ff) as the fill color
            c.addDonchianChannel(20, 0x9999ff, unchecked ((int)0xc06666ff));

            // Add a 75 pixels volume bars sub-chart to the bottom of the main chart, using
            // green/red/grey for up/down/flat days
            c.addVolBars(75, 0x99ff99, 0xff9999, 0x808080);

            // Append a MACD(26, 12) indicator chart (75 pixels high) after the main chart, using 9 days
            // for computing divergence.
            c.addMACD(75, 26, 12, 9, 0x0000ff, 0xff00ff, 0x008000);

            // Output the chart
            viewer.Image = c.makeWebImage(Chart.PNG);
        }
        //Main code for creating chart.
        //Note: the argument chartIndex is unused because this demo only has 1 chart.
        public void createChart(WPFChartViewer viewer, int chartIndex)
        {
            // Create a finance chart demo containing 100 days of data
            int noOfDays = 100;

            // To compute moving averages starting from the first day, we need to get extra data
            // points before the first day
            int extraDays = 30;

            // In this exammple, we use a random number generator utility to simulate the data. We
            // set up the random table to create 6 cols x (noOfDays + extraDays) rows, using 9 as
            // the seed.
            RanTable rantable = new RanTable(9, 6, noOfDays + extraDays);

            // Set the 1st col to be the timeStamp, starting from Sep 4, 2014, with each row
            // representing one day, and counting week days only (jump over Sat and Sun)
            rantable.setDateCol(0, new DateTime(2014, 9, 4), 86400, true);

            // Set the 2nd, 3rd, 4th and 5th columns to be high, low, open and close data. The open
            // value starts from 100, and the daily change is random from -5 to 5.
            rantable.setHLOCCols(1, 100, -5, 5);

            // Set the 6th column as the vol data from 5 to 25 million
            rantable.setCol(5, 50000000, 250000000);

            // Now we read the data from the table into arrays
            double[] timeStamps = rantable.getCol(0);
            double[] highData   = rantable.getCol(1);
            double[] lowData    = rantable.getCol(2);
            double[] openData   = rantable.getCol(3);
            double[] closeData  = rantable.getCol(4);
            double[] volData    = rantable.getCol(5);

            // Custom data series should be of the same length as the OHLC data series
            double[] buySignal  = new double[closeData.Length];
            double[] sellSignal = new double[closeData.Length];

            //
            // The following is just an arbitrary algorithm to create some meaningless buySignal and
            // sellSignal. They are just for demonstrating the charting engine. Please do not use
            // them for actual trading.
            //

            double[] sma5  = new ArrayMath(closeData).movAvg(5).result();
            double[] sma20 = new ArrayMath(closeData).movAvg(20).result();

            for (int i = 0; i < sma5.Length; ++i)
            {
                buySignal[i]  = Chart.NoValue;
                sellSignal[i] = Chart.NoValue;
                if (i > 0)
                {
                    if ((sma5[i - 1] <= sma20[i - 1]) && (sma5[i] > sma20[i]))
                    {
                        buySignal[i] = lowData[i];
                    }
                    if ((sma5[i - 1] >= sma20[i - 1]) && (sma5[i] < sma20[i]))
                    {
                        sellSignal[i] = highData[i];
                    }
                }
            }

            // Create a FinanceChart object of width 640 pixels
            FinanceChart c = new FinanceChart(640);

            // Add a title to the chart
            c.addTitle("Finance Chart with Custom Symbols");

            // Set the data into the finance chart object
            c.setData(timeStamps, highData, lowData, openData, closeData, volData, extraDays);

            // Add the main chart with 240 pixels in height
            XYChart mainChart = c.addMainChart(240);

            // Add buy signal symbols to the main chart, using cyan (0x00ffff) upward pointing
            // arrows as symbols
            ScatterLayer buyLayer = mainChart.addScatterLayer(null, buySignal, "Buy",
                                                              Chart.ArrowShape(0, 1, 0.4, 0.4), 11, 0x00ffff);

            // Shift the symbol lower by 20 pixels
            buyLayer.getDataSet(0).setSymbolOffset(0, 20);

            // Add sell signal symbols to the main chart, using purple (0x9900cc) downward pointing
            // arrows as symbols
            ScatterLayer sellLayer = mainChart.addScatterLayer(null, sellSignal, "Sell",
                                                               Chart.ArrowShape(180, 1, 0.4, 0.4), 11, 0x9900cc);

            // Shift the symbol higher by 20 pixels
            sellLayer.getDataSet(0).setSymbolOffset(0, -20);

            // Add a 5 period simple moving average to the main chart, using brown color
            c.addSimpleMovingAvg(5, 0x663300);

            // Add a 20 period simple moving average to the main chart, using purple color
            c.addSimpleMovingAvg(20, 0x9900ff);

            // Add candlestick symbols to the main chart, using green/red for up/down days
            c.addCandleStick(0x66ff66, 0xff6666);

            // Add a volume indicator chart (75 pixels high) after the main chart, using
            // green/red/grey for up/down/flat days
            c.addVolIndicator(75, 0x99ff99, 0xff9999, 0x808080);

            // Append a 14-days RSI indicator chart (75 pixels high) after the main chart. The main
            // RSI line is purple (800080). Set threshold region to +/- 20 (that is, RSI = 50 +/-
            // 25). The upper/lower threshold regions will be filled with red (ff0000)/blue
            // (0000ff).
            c.addRSI(75, 14, 0x800080, 20, 0xff0000, 0x0000ff);

            // Output the chart
            viewer.Chart = c;
        }
示例#7
0
        //Main code for creating chart.
        //Note: the argument chartIndex is unused because this demo only has 1 chart.
        public void createChart(WPFChartViewer viewer, int chartIndex)
        {
            //
            //    We use a random table to simulate generating 12 months of data
            //

            // Create the random table object with 4 cols * 12 rows, using 3 as seed
            RanTable rantable = new RanTable(3, 4, 12);

            // Set the 1st column to be the 12 months of year 2002
            rantable.setDateCol(0, new DateTime(2002, 1, 1), 86400 * 30);

            // Set the 2nd, 3rd and 4th columns to be random numbers starting from 125, 75, and 100
            // respectively. The change between rows is set to -35 to + 35. The minimum value of any
            // cell is 0.
            rantable.setCol(1, 125, -35, 35, 0);
            rantable.setCol(2, 75, -35, 35, 0);
            rantable.setCol(3, 100, -35, 35, 0);

            // Get the 1st column (time) as the x data
            double[] dataX = rantable.getCol(0);

            // Get the 2nd, 3rd and 4th columns as 3 data sets
            double[] dataY0 = rantable.getCol(1);
            double[] dataY1 = rantable.getCol(2);
            double[] dataY2 = rantable.getCol(3);

            // Create a XYChart object of size 360 x 400 pixels
            XYChart c = new XYChart(360, 400);

            // Add a title to the chart
            c.addTitle("<*underline=2*>Rotated Line Chart Demo", "Times New Roman Bold Italic", 14);

            // Set the plotarea at (60, 75) and of size 190 x 320 pixels. Turn on both horizontal
            // and vertical grid lines with light grey color (0xc0c0c0)
            c.setPlotArea(60, 75, 190, 320).setGridColor(0xc0c0c0, 0xc0c0c0);

            // Add a legend box at (270, 75)
            c.addLegend(270, 75);

            // Swap the x and y axis to become a rotated chart
            c.swapXY();

            // Set the y axis on the top side (right + rotated = top)
            c.setYAxisOnRight();

            // Add a title to the y axis
            c.yAxis().setTitle("Throughput (MBytes)");

            // Reverse the x axis so it is pointing downwards
            c.xAxis().setReverse();

            // Add a line chart layer using the given data
            LineLayer layer = c.addLineLayer2();

            layer.setXData(dataX);
            layer.addDataSet(dataY0, 0xff0000, "Server A");
            layer.addDataSet(dataY1, 0x338033, "Server B");
            layer.addDataSet(dataY2, 0x0000ff, "Server C");

            // Set the line width to 2 pixels
            layer.setLineWidth(2);

            // Output the chart
            viewer.Chart = c;

            //include tool tip for the chart
            viewer.ImageMap = c.getHTMLImageMap("clickable", "",
                                                "title='[{dataSetName}] {x|mm/yyyy}: {value|0} MByte'");
        }
示例#8
0
        //Main code for creating chart.
        //Note: the argument chartIndex is unused because this demo only has 1 chart.
        public void createChart(WinChartViewer viewer, int chartIndex)
        {
            // Create a finance chart demo containing 100 days of data
            int noOfDays = 100;

            // To compute moving averages starting from the first day, we need to get extra data
            // points before the first day
            int extraDays = 30;

            // In this exammple, we use a random number generator utility to simulate the data. We
            // set up the random table to create 6 cols x (noOfDays + extraDays) rows, using 9 as
            // the seed.
            RanTable rantable = new RanTable(9, 6, noOfDays + extraDays);

            // Set the 1st col to be the timeStamp, starting from Sep 4, 2002, with each row
            // representing one day, and counting week days only (jump over Sat and Sun)
            rantable.setDateCol(0, new DateTime(2002, 9, 4), 86400, true);

            // Set the 2nd, 3rd, 4th and 5th columns to be high, low, open and close data. The open
            // value starts from 100, and the daily change is random from -5 to 5.
            rantable.setHLOCCols(1, 100, -5, 5);

            // Set the 6th column as the vol data from 5 to 25 million
            rantable.setCol(5, 50000000, 250000000);

            // Now we read the data from the table into arrays
            double[] timeStamps = rantable.getCol(0);
            double[] highData   = rantable.getCol(1);
            double[] lowData    = rantable.getCol(2);
            double[] openData   = rantable.getCol(3);
            double[] closeData  = rantable.getCol(4);
            double[] volData    = rantable.getCol(5);

            // Create a FinanceChart object of width 640 pixels
            FinanceChart c = new FinanceChart(640);

            // Add a title to the chart
            c.addTitle("Finance Chart Demonstration");

            // Set the data into the finance chart object
            c.setData(timeStamps, highData, lowData, openData, closeData, volData, extraDays);

            // Add the main chart with 240 pixels in height
            c.addMainChart(240);

            // Add a 5 period simple moving average to the main chart, using brown color
            c.addSimpleMovingAvg(5, 0x663300);

            // Add a 20 period simple moving average to the main chart, using purple color
            c.addSimpleMovingAvg(20, 0x9900ff);

            // Add HLOC symbols to the main chart, using green/red for up/down days
            c.addHLOC(0x008000, 0xcc0000);

            // Add 20 days bollinger band to the main chart, using light blue (9999ff) as the border
            // and semi-transparent blue (c06666ff) as the fill color
            c.addBollingerBand(20, 2, 0x9999ff, unchecked ((int)0xc06666ff));

            // Add a 75 pixels volume bars sub-chart to the bottom of the main chart, using
            // green/red/grey for up/down/flat days
            c.addVolBars(75, 0x99ff99, 0xff9999, 0x808080);

            // Append a 14-days RSI indicator chart (75 pixels high) after the main chart. The main
            // RSI line is purple (800080). Set threshold region to +/- 20 (that is, RSI = 50 +/-
            // 25). The upper/lower threshold regions will be filled with red (ff0000)/blue
            // (0000ff).
            c.addRSI(75, 14, 0x800080, 20, 0xff0000, 0x0000ff);

            // Append a 12-days momentum indicator chart (75 pixels high) using blue (0000ff) color.
            c.addMomentum(75, 12, 0x0000ff);

            // Output the chart
            viewer.Chart = c;
        }
示例#9
0
        //
        // Create chart
        //
        private void createChart(RazorChartViewer viewer)
        {
            //
            //    We use a random number generator to simulate the data from 9:30am to 4:30pm with one
            //    data point every 4 minutes. The total number of points during that period is 106.  (7
            //    hours x 15 points/hour + 1)
            //
            int noOfPoints = 106;

            // Assume we have not reached the end of the day yet, and only 85 points are available.
            // Create a random table object of 1 col x 85 rows, using 9 as seed.
            RanTable rantable = new RanTable(9, 1, 85);

            // Set the 1st column to start with 1800 and with random delta from -5 to 5.
            rantable.setCol(0, 1800, -5, 5);

            // Get the data as the 1st column of the random table
            double[] data = rantable.getCol(0);

            // The x-axis labels for the chart
            string[] labels = { "-",   "10am", "-", " ", "-", "12am", "-", " ", "-", "2pm", "-", " ", "-",
                                "4pm", "-" };

            //
            //    Now we obtain the data into arrays, we can start to draw the chart using ChartDirector
            //

            // Create a XYChart object of size 180 x 180 pixels with a blue background (0x9c9cce)
            XYChart c = new XYChart(180, 180, 0x9c9cce);

            // Add titles to the top and bottom of the chart using 7.5pt Arial font. The text is white
            // 0xffffff on a deep blue 0x31319C background.
            c.addTitle2(Chart.Top, "STAR TECH INDEX  2003-01-28", "Arial", 7.5, 0xffffff, 0x31319c);
            c.addTitle2(Chart.Bottom, "LATEST  STI:1809.41 (+14.51)", "Arial", 7.5, 0xffffff, 0x31319c);

            // Set the plotarea at (31, 21) and of size 145 x 124 pixels, with a pale yellow (0xffffc8)
            // background.
            c.setPlotArea(31, 21, 145, 124, 0xffffc8);

            // Add custom text at (176, 21) (top right corner of plotarea) using 11pt Times Bold Italic
            // font/red (0xc09090) color
            c.addText(176, 21, "Chart Demo", "Times New Roman Bold Italic", 11, 0xc09090).setAlignment(
                Chart.TopRight);

            // Use 7.5pt Arial as the y axis label font
            c.yAxis().setLabelStyle("", 7.5);

            // Set the labels on the x axis by spreading the labels evenly between the first point (index
            // = 0) and the last point (index = noOfPoints - 1)
            c.xAxis().setLinearScale(0, noOfPoints - 1, labels);

            // Use 7.5pt Arial as the x axis label font
            c.xAxis().setLabelStyle("", 7.5);

            // Add a deep blue (0x000080) line layer to the chart
            c.addLineLayer(data, 0x000080);

            // Output the chart
            viewer.Image = c.makeWebImage(Chart.PNG);

            // Include tool tip for the chart. The chart starts at 9:30am and each point spans 240
            // seconds, so we can compute the time as {x}*240+9.5*3600.
            viewer.ImageMap = c.getHTMLImageMap("", "", "title='{={x}*240+9.5*3600|h:nna}: {value|2}'");
        }
示例#10
0
        private void FrmTrackFinance_Load(object sender, EventArgs e)
        {
            // Create a finance chart demo containing 100 days of data
            int noOfDays = 100;

            // To compute moving averages starting from the first day, we need to get extra data points before
            // the first day
            int extraDays = 30;

            // In this exammple, we use a random number generator utility to simulate the data. We set up the
            // random table to create 6 cols x (noOfDays + extraDays) rows, using 9 as the seed.
            RanTable rantable = new RanTable(9, 6, noOfDays + extraDays);

            // Set the 1st col to be the timeStamp, starting from Sep 4, 2011, with each row representing one
            // day, and counting week days only (jump over Sat and Sun)
            rantable.setDateCol(0, new DateTime(2011, 9, 4), 86400, true);

            // Set the 2nd, 3rd, 4th and 5th columns to be high, low, open and close data. The open value
            // starts from 100, and the daily change is random from -5 to 5.
            rantable.setHLOCCols(1, 100, -5, 5);

            // Set the 6th column as the vol data from 5 to 25 million
            rantable.setCol(5, 50000000, 250000000);

            // Now we read the data from the table into arrays
            double[] timeStamps = rantable.getCol(0);
            double[] highData   = rantable.getCol(1);
            double[] lowData    = rantable.getCol(2);
            double[] openData   = rantable.getCol(3);
            double[] closeData  = rantable.getCol(4);
            double[] volData    = rantable.getCol(5);

            // Create a FinanceChart object of width 720 pixels
            FinanceChart c = new FinanceChart(720);

            // Add a title to the chart
            c.addTitle("Finance Chart Demonstration");

            // Disable default legend box, as we are using dynamic legend
            c.setLegendStyle("normal", 8, Chart.Transparent, Chart.Transparent);

            // Set the data into the finance chart object
            c.setData(timeStamps, highData, lowData, openData, closeData, volData, extraDays);

            // Add the main chart with 240 pixels in height
            c.addMainChart(240);

            // Add a 10 period simple moving average to the main chart, using brown color
            c.addSimpleMovingAvg(10, 0x663300);

            // Add a 20 period simple moving average to the main chart, using purple color
            c.addSimpleMovingAvg(20, 0x9900ff);

            // Add candlestick symbols to the main chart, using green/red for up/down days
            c.addCandleStick(0x00ff00, 0xff0000);

            // Add 20 days bollinger band to the main chart, using light blue (9999ff) as the border and
            // semi-transparent blue (c06666ff) as the fill color
            c.addBollingerBand(20, 2, 0x9999ff, unchecked ((int)0xc06666ff));

            // Add a 75 pixels volume bars sub-chart to the bottom of the main chart, using green/red/grey for
            // up/down/flat days
            c.addVolBars(75, 0x99ff99, 0xff9999, 0x808080);

            // Append a 14-days RSI indicator chart (75 pixels high) after the main chart. The main RSI line
            // is purple (800080). Set threshold region to +/- 20 (that is, RSI = 50 +/- 25). The upper/lower
            // threshold regions will be filled with red (ff0000)/blue (0000ff).
            c.addRSI(75, 14, 0x800080, 20, 0xff0000, 0x0000ff);

            // Append a MACD(26, 12) indicator chart (75 pixels high) after the main chart, using 9 days for
            // computing divergence.
            c.addMACD(75, 26, 12, 9, 0x0000ff, 0xff00ff, 0x008000);

            // Include track line with legend for the latest data values
            trackFinance(c, ((XYChart)c.getChart(0)).getPlotArea().getRightX());

            // Assign the chart to the WinChartViewer
            winChartViewer1.Chart = c;
        }