// // Draw the chart and display it in the given viewer // void TrackAxis::drawChart(QChartViewer *viewer) { // Data for the chart as 2 random data series RanSeries r(127); DoubleArray data0 = r.getSeries(180, 10, -1.5, 1.5); DoubleArray data1 = r.getSeries(180, 150, -15, 15); DoubleArray timeStamps = r.getDateSeries(180, Chart::chartTime(2011, 1, 1), 86400); // Create a XYChart object of size 670 x 400 pixels XYChart *c = new XYChart(670, 400); // Add a title to the chart using 18 pts Times New Roman Bold Italic font c->addTitle("Plasma Stabilizer Energy Usage", "timesbi.ttf", 18); // Set the plotarea at (50, 55) with width 100 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). c->setPlotArea(50, 55, c->getWidth() - 100, c->getHeight() - 90, c->linearGradientColor(0, 55, 0, c->getHeight() - 35, 0xf0f6ff, 0xa0c0ff), -1, Chart::Transparent, 0xffffff, 0xffffff); // Add a legend box at (50, 25) using horizontal layout. Use 10pts Arial Bold as font. Set the // background and border color to Transparent. c->addLegend(50, 25, false, "arialbd.ttf", 10)->setBackground(Chart::Transparent); // Set axis label style to 8pts Arial Bold c->xAxis()->setLabelStyle("arialbd.ttf", 8); c->yAxis()->setLabelStyle("arialbd.ttf", 8); c->yAxis2()->setLabelStyle("arialbd.ttf", 8); // Set the axis stem to transparent c->xAxis()->setColors(Chart::Transparent); c->yAxis()->setColors(Chart::Transparent); c->yAxis2()->setColors(Chart::Transparent); // Configure x-axis label format c->xAxis()->setMultiFormat(Chart::StartOfYearFilter(), "{value|mm/yyyy} ", Chart::StartOfMonthFilter(), "{value|mm}"); // Add axis title using 10pts Arial Bold Italic font c->yAxis()->setTitle("Power Usage (Watt)", "arialbi.ttf", 10); c->yAxis2()->setTitle("Effective Load (kg)", "arialbi.ttf", 10); // Add a line layer to the chart using a line width of 2 pixels. LineLayer *layer = c->addLineLayer(); layer->setLineWidth(2); // Add 2 data series to the line layer layer->setXData(timeStamps); layer->addDataSet(data0, 0xcc0000, "Power Usage"); layer->addDataSet(data1, 0x008800, "Effective Load")->setUseYAxis2(); // Set the chart image to the QChartViewer viewer->setChart(c); }
void GraphWidget::drawChart() { XYChart *c = new XYChart(size.width(), size.height() - 100, Chart::Transparent); c->setPlotArea(10, 50, c->getWidth() - 65, c->getHeight() - 10, 0x000000, -1, 0xC8C8C8, Chart::Transparent, Chart::Transparent); c->setClipping(); c->getLegend()->setLineStyleKey(); c->getLegend()->setFontSize(10); //遍历查询结果并绘制结果 int ea_result_count = ea_results.size(); //设置X轴的label for(int i = 0;i < ea_result_count;i++){ ExchangeRateResult *ea_result = ea_results[i]; DoubleArray x_data = getXData(i); DoubleArray y_data = ea_result->getYData(); double viewPortStartDate = m_ChartViewer->getValueAtViewPort("x", m_ChartViewer->getViewPortLeft()); double viewPortEndDate = m_ChartViewer->getValueAtViewPort("x", m_ChartViewer->getViewPortLeft() + m_ChartViewer->getViewPortWidth()); int startIndex = (int)floor(Chart::bSearch(x_data, viewPortStartDate)); int endIndex = (int)ceil(Chart::bSearch(x_data, viewPortEndDate)); int noOfPoints = endIndex - startIndex + 1; DoubleArray viewPortXData = DoubleArray(x_data.data + startIndex, noOfPoints); DoubleArray viewPortYData = DoubleArray(y_data.data + startIndex, noOfPoints); //添加图层 LineLayer *layer = c->addLineLayer(); layer->setLineWidth(1); //设置X轴 layer->setXData(viewPortXData); //设置Y轴 layer->addDataSet(viewPortYData, ea_result->getColor(), ea_result->getName().toUtf8().data())->setUseYAxis2(); } c->xAxis()->setLabelStyle("arial.ttf", 10); c->yAxis2()->setLabelStyle("arial.ttf", 10); c->xAxis()->setColors(0xC8C8C8, 0xC8C8C8); c->yAxis2()->setColors(0xC8C8C8, 0xC8C8C8); m_ChartViewer->syncDateAxisWithViewPort("x", c->xAxis()); c->yAxis()->setTickDensity(30); c->yAxis2()->setTickDensity(30); if (!m_ChartViewer->isInMouseMoveEvent()) { trackLineLegend(c, (0 == m_ChartViewer->getChart()) ? c->getPlotArea()->getRightX() : m_ChartViewer->getPlotAreaMouseX()); } delete m_ChartViewer->getChart(); m_ChartViewer->setChart(c); }
void GraphWidget::drawFullChart(){ nameList.clear(); initChartViewer(); XYChart *c = new XYChart(size.width(), 100, Chart::Transparent); c->setPlotArea(10, 5, c->getWidth() - 65, c->getHeight() - 15, 0x000000, -1, 0xC8C8C8, Chart::Transparent, 0xffffff); c->xAxis()->setColors(Chart::Transparent); c->xAxis()->setLabelStyle("arial.ttf", 10); c->xAxis()->setLabelGap(-1); c->xAxis()->setLabelAlignment(1); c->yAxis()->setColors(Chart::Transparent, Chart::Transparent); //遍历查询结果并绘制结果 int ea_result_count = ea_results.size(); //设置X轴的label for(int i = 0;i < ea_result_count;i++){ ExchangeRateResult *ea_result = ea_results[i]; DoubleArray y_data = ea_result->getYData(); //添加图层 LineLayer *layer = c->addLineLayer(); layer->setFastLineMode(); layer->setLineWidth(1); //设置X轴 layer->setXData(getXData(i)); //设置Y轴 layer->addDataSet(y_data, ea_result->getColor(), ea_result->getName().toUtf8().data()); } c->xAxis()->setDateScale(m_ChartViewer->getValueAtViewPort("x", 0), m_ChartViewer->getValueAtViewPort("x", 1)); // c->xAxis()->setTickDensity(75); c->yAxis()->setRounding(false, false); delete m_ViewPortControl->getChart(); m_ViewPortControl->setChart(c); drawChart(); }
int main(int argc, char *argv[]) { // The data for the chart double dataY[] = {1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 0, 1, 1}; double dataX[] = {Chart::chartTime(2008, 7, 1, 0, 0, 0), Chart::chartTime(2008, 7, 1, 2, 17, 2), Chart::chartTime(2008, 7, 1, 8, 5, 30), Chart::chartTime(2008, 7, 1, 10, 54, 10), Chart::chartTime(2008, 7, 1, 15, 40, 0), Chart::chartTime(2008, 7, 1, 18, 22, 20), Chart::chartTime(2008, 7, 1, 22, 17, 14), Chart::chartTime(2008, 7, 2, 2, 55, 50), Chart::chartTime(2008, 7, 2, 8, 17, 14), Chart::chartTime(2008, 7, 2, 11, 55, 50), Chart::chartTime(2008, 7, 2, 13, 17, 14), Chart::chartTime(2008, 7, 2, 17, 55, 50), Chart::chartTime(2008, 7, 2, 20, 17, 14), Chart::chartTime(2008, 7, 3, 0, 0, 0)}; // In this example, we only use position 1, 3, 5 for the data series. Positions 0, 2, 4, 6 are // empty and serve as gaps. const char *labels[] = {"", "ON Only Filling", "", "<*font,color=cc2200*>ON<*/font*> / <*font,color=00aa22*>OFF<*/font*> Filling", "", "Logic Line", ""}; // Create a XYChart object of size 600 x 180 pixels XYChart *c = new XYChart(600, 180); // Add a title to the chart using 10 points Arial Bold font. Set top/bottom margins to 12 // pixels. TextBox *title = c->addTitle("Binary Data Series Demonstration", "arialbd.ttf", 10); // Tentatively set the plotarea at (100, 30) and of size 470 x 120 pixels. Use transparent // border. Use grey (888888) solid line and light grey (ccccc) dotted line as major and minor // vertical grid lines. c->setPlotArea(100, 30, 470, 120, -1, -1, Chart::Transparent)->setGridColor(Chart::Transparent, 0x888888, Chart::Transparent, c->dashLineColor(0xcccccc, Chart::DotLine)); // Set axes to transparent c->xAxis()->setColors(Chart::Transparent); c->yAxis()->setColors(Chart::Transparent); // Set the y axis labels c->yAxis()->setLabels(StringArray(labels, (int)(sizeof(labels) / sizeof(labels[0])))); // Set y-axis label style to 8pt Arial Bold c->yAxis()->setLabelStyle("arialbd.ttf", 8); // Set x-axis major and minor tick density to 50 and 5 pixels. ChartDirector auto-scaling will // use this as the guideline when putting ticks on the x-axis. c->xAxis()->setTickDensity(50, 5); // Use "<*font=Arial Bold*>{value|mmm dd}" for the first label of an hour, and "{value|hh:nn}" // for all other labels. c->xAxis()->setMultiFormat(Chart::StartOfDayFilter(), "<*font=arialbd.ttf*>{value|mmm dd}", Chart::AllPassFilter(), "{value|hh:nn}"); // // A Logic Line can be achieved using a StepLineLayer in ChartDirector // // Shift the data by 4.5, so instead of 0 - 1, it is now 4.5 to 5.5, or fluctuate around the y = // 5 (Logic Line label) position. ArrayMath shiftedLine0 = ArrayMath(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0]))) ).add(4.5); // Add step lines using the original and the reversed data StepLineLayer *layer0 = c->addStepLineLayer(shiftedLine0, 0x0000ff); layer0->setXData(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0])))); // // To perform ON/OFF filling, we draw the logic line, and its reverse, and fill the region in // between // // Shift the data by 2.5, so instead of 0 - 1, it is now 2.5 to 3.5, or fluctuate around the y = // 3 (ON/OFF Filing label) position. ArrayMath shiftedLine1 = ArrayMath(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0]))) ).add(2.5); // Reverse the data, so the 0 becomes 1 and 1 becomes 0, and shift it as well. ArrayMath reverseShiftedLine1 = ArrayMath(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[ 0])))).mul(-1).add(3.5); // Add step lines using the original and the reversed data StepLineLayer *layer1 = c->addStepLineLayer(shiftedLine1, Chart::Transparent); layer1->addDataSet(reverseShiftedLine1, Chart::Transparent); layer1->setXData(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0])))); // Fill the region between the two step lines with green (00aa22) or red (cc2200), depending on // whether the original or the reserve is higher. c->addInterLineLayer(layer1->getLine(0), layer1->getLine(1), 0x00aa22, 0xcc2200); // // The ON Only filling is the same as ON/OFF filling, except the OFF filling color is // transparent // // Shift the data by 0.5, so instead of 0 - 1, it is now 0.5 to 1.5, or fluctuate around the y = // 1 (ON Only Filing label) position. ArrayMath shiftedLine2 = ArrayMath(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0]))) ).add(0.5); // Reverse the data, so the 0 becomes 1 and 1 becomes 0, and shift it as well. ArrayMath reverseShiftedLine2 = ArrayMath(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[ 0])))).mul(-1).add(1.5); // Add step lines using the original and the reversed data StepLineLayer *layer2 = c->addStepLineLayer(shiftedLine2, Chart::Transparent); layer2->addDataSet(reverseShiftedLine2, Chart::Transparent); layer2->setXData(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0])))); // Fill the region between the two step lines with green (00aa22) or transparent, depending on // whether the original or the reserve is higher. c->addInterLineLayer(layer2->getLine(0), layer2->getLine(1), 0x00aa22, Chart::Transparent); // Adjust the plot area size, such that the bounding box (inclusive of axes) is 10 pixels from // the left edge, 10 pixels below the title, 30 pixels from the right edge, and 10 pixels above // the bottom edge. c->packPlotArea(10, title->getHeight() + 10, c->getWidth() - 30, c->getHeight() - 10); // Output the chart c->makeChart("binaryseries.png"); //free up resources delete c; return 0; }
// // Draw the chart and display it in the given viewer // void ZoomScrollTrack2::drawChart(QChartViewer *viewer) { // Get the start date and end date that are visible on the chart. double viewPortStartDate = viewer->getValueAtViewPort("x", viewer->getViewPortLeft()); double viewPortEndDate = viewer->getValueAtViewPort("x", viewer->getViewPortLeft() + viewer->getViewPortWidth()); // Get the array indexes that corresponds to the visible start and end dates int startIndex = (int)floor(Chart::bSearch(m_timeStamps, viewPortStartDate)); int endIndex = (int)ceil(Chart::bSearch(m_timeStamps, viewPortEndDate)); int noOfPoints = endIndex - startIndex + 1; // Extract the part of the data array that are visible. DoubleArray viewPortTimeStamps = DoubleArray(m_timeStamps.data + startIndex, noOfPoints); DoubleArray viewPortDataSeriesA = DoubleArray(m_dataSeriesA.data + startIndex, noOfPoints); DoubleArray viewPortDataSeriesB = DoubleArray(m_dataSeriesB.data + startIndex, noOfPoints); DoubleArray viewPortDataSeriesC = DoubleArray(m_dataSeriesC.data + startIndex, noOfPoints); // // At this stage, we have extracted the visible data. We can use those data to plot the chart. // /////////////////////////////////////////////////////////////////////////////////////// // Configure overall chart appearance. /////////////////////////////////////////////////////////////////////////////////////// // Create an XYChart object of size 650 x 350 pixels, with a white (ffffff) background and grey // (aaaaaa) border XYChart *c = new XYChart(650, 350, 0xffffff, 0xaaaaaa); // Set the plotarea at (55, 55) with width 90 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). c->setPlotArea(55, 55, c->getWidth() - 90, c->getHeight() - 90, c->linearGradientColor(0, 55, 0, c->getHeight() - 35, 0xf0f6ff, 0xa0c0ff), -1, Chart::Transparent, 0xffffff, 0xffffff); // As the data can lie outside the plotarea in a zoomed chart, we need enable clipping. c->setClipping(); // Add a title to the chart using 18 pts Times New Roman Bold Italic font c->addTitle(" Zooming and Scrolling with Track Line (2)", "timesbi.ttf", 18); // Add a legend box at (55, 30) using horizontal layout. Use 8pts Arial Bold as font. Set the // background and border color to Transparent and use line style legend key. LegendBox *b = c->addLegend(55, 30, false, "arialbd.ttf", 8); b->setBackground(Chart::Transparent); b->setLineStyleKey(); // Set the axis stem to transparent c->xAxis()->setColors(Chart::Transparent); c->yAxis()->setColors(Chart::Transparent); // Add axis title using 10pts Arial Bold Italic font c->yAxis()->setTitle("Ionic Temperature (C)", "arialbi.ttf", 10); /////////////////////////////////////////////////////////////////////////////////////// // Add data to chart /////////////////////////////////////////////////////////////////////////////////////// // // In this example, we represent the data by lines. You may modify the code below to use other // representations (areas, scatter plot, etc). // // Add a line layer for the lines, using a line width of 2 pixels LineLayer *layer = c->addLineLayer(); layer->setLineWidth(2); // In this demo, we do not have too many data points. In real code, the chart may contain a lot // of data points when fully zoomed out - much more than the number of horizontal pixels in this // plot area. So it is a good idea to use fast line mode. layer->setFastLineMode(); // Now we add the 3 data series to a line layer, using the color red (ff0000), green // (00cc00) and blue (0000ff) layer->setXData(viewPortTimeStamps); layer->addDataSet(viewPortDataSeriesA, 0xff3333, "Alpha"); layer->addDataSet(viewPortDataSeriesB, 0x008800, "Beta"); layer->addDataSet(viewPortDataSeriesC, 0x3333CC, "Gamma"); /////////////////////////////////////////////////////////////////////////////////////// // Configure axis scale and labelling /////////////////////////////////////////////////////////////////////////////////////// // Set the x-axis as a date/time axis with the scale according to the view port x range. viewer->syncDateAxisWithViewPort("x", c->xAxis()); // // In this demo, the time range can be from a few years to a few days. We demonstrate how to set // up different date/time format based on the time range. // // If all ticks are yearly aligned, then we use "yyyy" as the label format. c->xAxis()->setFormatCondition("align", 360 * 86400); c->xAxis()->setLabelFormat("{value|yyyy}"); // If all ticks are monthly aligned, then we use "mmm yyyy" in bold font as the first // label of a year, and "mmm" for other labels. c->xAxis()->setFormatCondition("align", 30 * 86400); c->xAxis()->setMultiFormat(Chart::StartOfYearFilter(), "<*font=bold*>{value|mmm yyyy}", Chart::AllPassFilter(), "{value|mmm}"); // If all ticks are daily algined, then we use "mmm dd<*br*>yyyy" in bold font as the // first label of a year, and "mmm dd" in bold font as the first label of a month, and // "dd" for other labels. c->xAxis()->setFormatCondition("align", 86400); c->xAxis()->setMultiFormat(Chart::StartOfYearFilter(), "<*block,halign=left*><*font=bold*>{value|mmm dd<*br*>yyyy}", Chart::StartOfMonthFilter(), "<*font=bold*>{value|mmm dd}"); c->xAxis()->setMultiFormat(Chart::AllPassFilter(), "{value|dd}"); // For all other cases (sub-daily ticks), use "hh:nn<*br*>mmm dd" for the first label of // a day, and "hh:nn" for other labels. c->xAxis()->setFormatCondition("else"); c->xAxis()->setMultiFormat(Chart::StartOfDayFilter(), "<*font=bold*>{value|hh:nn<*br*>mmm dd}", Chart::AllPassFilter(), "{value|hh:nn}"); /////////////////////////////////////////////////////////////////////////////////////// // Output the chart /////////////////////////////////////////////////////////////////////////////////////// // We need to update the track line too. If the mouse is moving on the chart (eg. if // the user drags the mouse on the chart to scroll it), the track line will be updated // in the MouseMovePlotArea event. Otherwise, we need to update the track line here. if ((!viewer->isInMouseMoveEvent()) && viewer->isMouseOnPlotArea()) trackLineLabel(c, viewer->getPlotAreaMouseX()); delete viewer->getChart(); viewer->setChart(c); }
int main(int argc, char *argv[]) { // The data for the chart double data[] = {40, 15, 7, 5, 2}; // The labels for the chart const char *labels[] = {"Hard Disk", "PCB", "Printer", "CDROM", "Keyboard"}; // In the pareto chart, the line data are just the accumulation of the raw data, // scaled to a range of 0 - 100% ArrayMath lineData = ArrayMath(DoubleArray(data, sizeof(data)/sizeof(data[0]))); lineData.acc(); double scaleFactor = lineData.max() / 100; if (scaleFactor == 0) { // Avoid division by zero error for zero data scaleFactor = 1; } lineData.div(scaleFactor); // Create a XYChart object of size 480 x 300 pixels. Set background color to // brushed silver, with a grey (bbbbbb) border and 2 pixel 3D raised effect. Use // rounded corners. Enable soft drop shadow. XYChart *c = new XYChart(400, 300, Chart::brushedSilverColor(), 0xbbbbbb, 2); c->setRoundedFrame(); c->setDropShadow(); // Add a title to the chart using 15 points Arial Italic. Set top/bottom margins // to 12 pixels. TextBox *title = c->addTitle("Pareto Chart Demonstration", "ariali.ttf", 15); title->setMargin(0, 0, 12, 12); // Tentatively set the plotarea at (50, 40). Set the width to 100 pixels less // than the chart width, and the height to 80 pixels less than the chart height. // Use pale grey (f4f4f4) background, transparent border, and dark grey (444444) // dotted grid lines. c->setPlotArea(50, 40, c->getWidth() - 100, c->getHeight() - 80, 0xf4f4f4, -1, Chart::Transparent, c->dashLineColor(0x444444, Chart::DotLine)); // Add a line layer for the pareto line LineLayer *lineLayer = c->addLineLayer(); // Add the pareto line using deep blue (0000ff) as the color, with circle symbols lineLayer->addDataSet(lineData.result(), 0x0000ff)->setDataSymbol( Chart::CircleShape, 9, 0x0000ff, 0x0000ff); // Set the line width to 2 pixel lineLayer->setLineWidth(2); // Bind the line layer to the secondary (right) y-axis. lineLayer->setUseYAxis2(); // Add a multi-color bar layer using the given data. BarLayer *barLayer = c->addBarLayer(DoubleArray(data, sizeof(data)/sizeof(data[0])), IntArray(0, 0)); // Set soft lighting for the bars with light direction from the right barLayer->setBorderColor(Chart::Transparent, Chart::softLighting(Chart::Right)); // Set the labels on the x axis. c->xAxis()->setLabels(StringArray(labels, sizeof(labels)/sizeof(labels[0]))); // Set the secondary (right) y-axis scale as 0 - 100 with a tick every 20 units c->yAxis2()->setLinearScale(0, 100, 20); // Set the format of the secondary (right) y-axis label to include a percentage // sign c->yAxis2()->setLabelFormat("{value}%"); // Set the relationship between the two y-axes, which only differ by a scaling // factor c->yAxis()->syncAxis(c->yAxis2(), scaleFactor); // Set the format of the primary y-axis label foramt to show no decimal point c->yAxis()->setLabelFormat("{value|0}"); // Add a title to the primary y-axis c->yAxis()->setTitle("Frequency"); // Set all axes to transparent c->xAxis()->setColors(Chart::Transparent); c->yAxis()->setColors(Chart::Transparent); c->yAxis2()->setColors(Chart::Transparent); // Adjust the plot area size, such that the bounding box (inclusive of axes) is // 10 pixels from the left edge, just below the title, 10 pixels from the right // edge, and 20 pixels from the bottom edge. c->packPlotArea(10, title->getHeight(), c->getWidth() - 10, c->getHeight() - 20); // Output the chart c->makeChart("pareto.jpg"); //free up resources delete c; return 0; }
int main(int argc, char *argv[]) { // In this example, the data points are unevenly spaced on the x-axis double dataY[] = {4.7, 4.7, 6.6, 2.2, 4.7, 4.0, 4.0, 5.1, 4.5, 4.5, 6.8, 4.5, 4, 2.1, 3, 2.5, 2.5, 3.1}; double dataX[] = {Chart::chartTime(1999, 7, 1), Chart::chartTime(2000, 1, 1), Chart::chartTime( 2000, 2, 1), Chart::chartTime(2000, 4, 1), Chart::chartTime(2000, 5, 8), Chart::chartTime( 2000, 7, 5), Chart::chartTime(2001, 3, 5), Chart::chartTime(2001, 4, 7), Chart::chartTime( 2001, 5, 9), Chart::chartTime(2002, 2, 4), Chart::chartTime(2002, 4, 4), Chart::chartTime( 2002, 5, 8), Chart::chartTime(2002, 7, 7), Chart::chartTime(2002, 8, 30), Chart::chartTime( 2003, 1, 2), Chart::chartTime(2003, 2, 16), Chart::chartTime(2003, 11, 6), Chart::chartTime( 2004, 1, 4)}; // Data points are assigned different symbols based on point type double pointType[] = {0, 1, 0, 1, 2, 1, 0, 0, 1, 1, 2, 2, 1, 0, 2, 1, 2, 0}; // Create a XYChart object of size 480 x 320 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. XYChart *c = new XYChart(480, 320); c->setBackground(c->linearGradientColor(0, 0, 0, c->getHeight() / 2, 0xe8f0f8, 0xaaccff), 0x88aaee); c->setRoundedFrame(); c->setDropShadow(); // Add a title to the chart using 15 points Arial Italic font. Set top/bottom margins to 12 // pixels. TextBox *title = c->addTitle("Multi-Symbol Line Chart Demo", "ariali.ttf", 15); title->setMargin(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 and vertical grid lines. c->setPlotArea(50, title->getHeight(), c->getWidth() - 65, c->getHeight() - title->getHeight() - 90, 0xe8f0f8, -1, Chart::Transparent, c->dashLineColor(0x888888, Chart::DotLine), -1); // Add a legend box where the bottom-center is anchored to the 12 pixels above the bottom-center // of the chart. Use horizontal layout and 8 points Arial font. LegendBox *legendBox = c->addLegend(c->getWidth() / 2, c->getHeight() - 12, false, "arialbd.ttf", 8); legendBox->setAlignment(Chart::BottomCenter); // Set the legend box background and border to pale blue (e8f0f8) and bluish grey (445566) legendBox->setBackground(0xe8f0f8, 0x445566); // Use rounded corners of 5 pixel radius for the legend box legendBox->setRoundedCorners(5); // Set the y axis label format to display a percentage sign c->yAxis()->setLabelFormat("{value}%"); // Set y-axis title to use 10 points Arial Bold Italic font c->yAxis()->setTitle("Axis Title Placeholder", "arialbi.ttf", 10); // Set axis labels to use Arial Bold font c->yAxis()->setLabelStyle("arialbd.ttf"); c->xAxis()->setLabelStyle("arialbd.ttf"); // We add the different data symbols using scatter layers. The scatter layers are added before // the line layer to make sure the data symbols stay on top of the line layer. // We select the points with pointType = 0 (the non-selected points will be set to NoValue), and // use yellow (ffff00) 15 pixels high 5 pointed star shape symbols for the points. (This example // uses both x and y coordinates. For charts that have no x explicitly coordinates, use an empty // array as dataX.) c->addScatterLayer(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0]))), ArrayMath( DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0])))).selectEQZ(DoubleArray( pointType, (int)(sizeof(pointType) / sizeof(pointType[0]))), Chart::NoValue), "Point Type 0", Chart::StarShape(5), 15, 0xffff00); // Similar to above, we select the points with pointType - 1 = 0 and use green (ff00) 13 pixels // high six-sided polygon as symbols. c->addScatterLayer(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0]))), ArrayMath( DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0])))).selectEQZ(ArrayMath( DoubleArray(pointType, (int)(sizeof(pointType) / sizeof(pointType[0])))).sub(1), Chart::NoValue), "Point Type 1", Chart::PolygonShape(6), 13, 0x00ff00); // Similar to above, we select the points with pointType - 2 = 0 and use red (ff0000) 13 pixels // high X shape as symbols. c->addScatterLayer(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0]))), ArrayMath( DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0])))).selectEQZ(ArrayMath( DoubleArray(pointType, (int)(sizeof(pointType) / sizeof(pointType[0])))).sub(2), Chart::NoValue), "Point Type 2", Chart::Cross2Shape(), 13, 0xff0000); // Finally, add a blue (0000ff) line layer with line width of 2 pixels LineLayer *layer = c->addLineLayer(DoubleArray(dataY, (int)(sizeof(dataY) / sizeof(dataY[0]))), 0x0000ff); layer->setXData(DoubleArray(dataX, (int)(sizeof(dataX) / sizeof(dataX[0])))); layer->setLineWidth(2); // Adjust the plot area size, such that the bounding box (inclusive of axes) is 10 pixels from // the left edge, just below the title, 25 pixels from the right edge, and 8 pixels above the // legend box. c->packPlotArea(10, title->getHeight(), c->getWidth() - 25, c->layoutLegend()->getTopY() - 8); // Output the chart c->makeChart("multisymbolline.png"); //free up resources delete c; return 0; }
int main(int argc, char *argv[]) { // The data for the chart double data[] = {800, 600, 1000, 1400}; double widths[] = {250, 500, 960, 460}; const char *labels[] = {"Wind", "Hydro", "Coal", "Natural Gas"}; // The colors to use int colors[] = {0x00aa00, 0x66aaee, 0xee6622, 0xffbb00}; // Create a XYChart object of size 500 x 350 pixels XYChart *c = new XYChart(500, 350); // Add a title to the chart using 15 pts Arial Italic font c->addTitle("Energy Generation Breakdown", "ariali.ttf", 15); // Set the plotarea at (60, 60) and of (chart_width - 90) x (chart_height - 100) // in size. Use a vertical gradient color from light blue (f9f9ff) to sky blue // (aaccff) as background. Set grid lines to white (ffffff). int plotAreaBgColor = c->linearGradientColor(0, 60, 0, c->getHeight() - 40, 0xaaccff, 0xf9fcff); c->setPlotArea(60, 60, c->getWidth() - 90, c->getHeight() - 100, plotAreaBgColor, -1, -1, 0xffffff); // Add a legend box at (50, 30) using horizontal layout and transparent // background. c->addLegend(55, 30, false)->setBackground(Chart::Transparent); // Add titles to x/y axes with 10 points Arial Bold font c->xAxis()->setTitle("Mega Watts", "arialbd.ttf", 10); c->yAxis()->setTitle("Cost per MWh (dollars)", "arialbd.ttf", 10); // Set the x axis rounding to false, so that the x-axis will fit the data exactly c->xAxis()->setRounding(false, false); // In ChartDirector, there is no bar layer that can have variable bar widths, but // you may create a bar using an area layer. (A bar can be considered as the area // under a rectangular outline.) So by using a loop to create one bar per area // layer, we can achieve a variable width bar chart. // starting position of current bar double currentX = 0; int i; for(i = 0; i < sizeof(data) / sizeof(data[0]); ++i) { // ending position of current bar double nextX = currentX + widths[i]; // outline of the bar double dataX[] = {currentX, currentX, nextX, nextX}; double dataY[] = {0, data[i], data[i], 0}; // create the area layer to fill the bar AreaLayer *layer = c->addAreaLayer(DoubleArray(dataY, sizeof(dataY)/sizeof(dataY[0])), colors[i], labels[i]); layer->setXData(DoubleArray(dataX, sizeof(dataX)/sizeof(dataX[0]))); // the ending position becomes the starting position of the next bar currentX = nextX; } // Output the chart c->makeChart("varwidthbar.png"); //free up resources delete c; return 0; }
int main(int argc, char *argv[]) { // The data for the chart double data0[] = {42, 49, Chart::NoValue, 38, 64, 56, 29, 41, 44, 57}; double data1[] = {65, 75, 47, 34, 42, 49, 73, Chart::NoValue, 90, 69, 66, 78}; double data2[] = {Chart::NoValue, Chart::NoValue, 25, 28, 38, 20, 22, Chart::NoValue, 25, 33, 30, 24}; const char *labels[] = {"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"}; // Create a XYChart object of size 600 x 360 pixels. Set background color to // brushed silver, with a 2 pixel 3D border. Use rounded corners. XYChart *c = new XYChart(600, 360, Chart::brushedSilverColor(), Chart::Transparent, 2); c->setRoundedFrame(); // Add a title using 18 pts Times New Roman Bold Italic font. #Set top/bottom // margins to 6 pixels. TextBox *title = c->addTitle("Product Line Global Revenue", "timesbi.ttf", 18); title->setMargin(0, 0, 6, 6); // Add a separator line just under the title c->addLine(10, title->getHeight(), c->getWidth() - 11, title->getHeight(), Chart::LineColor); // Add a legend box where the top-center is anchored to the horizontal center of // the chart, just under the title. Use horizontal layout and 10 points Arial // Bold font, and transparent background and border. LegendBox *legendBox = c->addLegend(c->getWidth() / 2, title->getHeight(), false, "arialbd.ttf", 10); legendBox->setAlignment(Chart::TopCenter); legendBox->setBackground(Chart::Transparent, Chart::Transparent); // Tentatively set the plotarea at (70, 75) and of 460 x 240 pixels in size. Use // transparent border and black (000000) grid lines c->setPlotArea(70, 75, 460, 240, -1, -1, Chart::Transparent, 0x000000, -1); // Set the x axis labels c->xAxis()->setLabels(StringArray(labels, sizeof(labels)/sizeof(labels[0]))); // Show the same scale on the left and right y-axes c->syncYAxis(); // Set y-axis tick density to 30 pixels. ChartDirector auto-scaling will use this // as the guideline when putting ticks on the y-axis. c->yAxis()->setTickDensity(30); // Set all axes to transparent c->xAxis()->setColors(Chart::Transparent); c->yAxis()->setColors(Chart::Transparent); c->yAxis2()->setColors(Chart::Transparent); // Set the x-axis margins to 15 pixels, so that the horizontal grid lines can // extend beyond the leftmost and rightmost vertical grid lines c->xAxis()->setMargin(15, 15); // Set axis label style to 8pts Arial Bold c->xAxis()->setLabelStyle("arialbd.ttf", 8); c->yAxis()->setLabelStyle("arialbd.ttf", 8); c->yAxis2()->setLabelStyle("arialbd.ttf", 8); // Add axis title using 10pts Arial Bold Italic font c->yAxis()->setTitle("Revenue in USD millions", "arialbi.ttf", 10); c->yAxis2()->setTitle("Revenue in USD millions", "arialbi.ttf", 10); // Add the first line. The missing data will be represented as gaps in the line // (the default behaviour) LineLayer *layer0 = c->addLineLayer(); layer0->addDataSet(DoubleArray(data0, sizeof(data0)/sizeof(data0[0])), 0xff0000, "Quantum Computer")->setDataSymbol(Chart::GlassSphere2Shape, 11); layer0->setLineWidth(3); // Add the second line. The missing data will be represented by using dash lines // to bridge the gap LineLayer *layer1 = c->addLineLayer(); layer1->addDataSet(DoubleArray(data1, sizeof(data1)/sizeof(data1[0])), 0x00ff00, "Atom Synthesizer")->setDataSymbol(Chart::GlassSphere2Shape, 11); layer1->setLineWidth(3); layer1->setGapColor(c->dashLineColor(0x00ff00)); // Add the third line. The missing data will be ignored - just join the gap with // the original line style. LineLayer *layer2 = c->addLineLayer(); layer2->addDataSet(DoubleArray(data2, sizeof(data2)/sizeof(data2[0])), 0xff6600, "Proton Cannon")->setDataSymbol(Chart::GlassSphere2Shape, 11); layer2->setLineWidth(3); layer2->setGapColor(Chart::SameAsMainColor); // layout the legend so we can get the height of the legend box c->layoutLegend(); // Adjust the plot area size, such that the bounding box (inclusive of axes) is // 15 pixels from the left edge, just under the legend box, 16 pixels from the // right edge, and 25 pixels from the bottom edge. c->packPlotArea(15, legendBox->getTopY() + legendBox->getHeight(), c->getWidth() - 16, c->getHeight() - 25); // Output the chart c->makeChart("missingpoints.jpg"); //free up resources delete c; return 0; }