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

Message ListMessage List     Post MessagePost Message

  how could i change the label of x-axis from hh:nn:ss format to seconds counted from the program start
Posted by JSF on Nov-09-2016 10:24
Attachments:
As the figure shows below, I want to change the x-axis format to seconds.
When I run the program, it's 0 second, and then increasing by seconds.

Here are the codes of drawChart function. the time of program starting is m_vvData_x[i][0].
I think firstly each m_vvData_x[i] data should minus m_vvData_x[i][0] in order to extract the duration. Then the label format should change to c->xAxis()->setLabelFormat("{value|ss}") ?

I tried but failed. Please help me. Many thanks!
1.png
1.cpp
		//主画图程序
		// 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_dataXCoor, viewPortStartDate));
		int endIndex = (int)ceil(Chart::bSearch(m_dataXCoor, viewPortEndDate));
		int noOfPoints = endIndex - startIndex + 1;
		if (noOfPoints > 1)	
		{
			//有数据时绘图

			DoubleArray * viewPortData = new DoubleArray[m_num];
			DoubleArray * viewPortTime = new DoubleArray[m_num];

			for (int i = 0; i < m_num; ++i)
			{

				DoubleArray tempTime = DoubleArray(&m_vvData_x[i][0],m_vvData_x[i].size());
				viewPortTime[i] = DoubleArray(tempTime.data + startIndex,noOfPoints);
				DoubleArray tempArr = DoubleArray(&m_vvData_y[i][0],m_vvData_y[i].size());
				viewPortData[i] = DoubleArray(tempArr.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(m_plotArea_width, m_plotArea_height, 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("   IS_Group Software Testing", "timesbi.ttf", 18);

			// Set legend icon style to use line style icon, sized for 8pt font
			c->getLegend()->setLineStyleKey();
			c->getLegend()->setFontSize(8);

			// 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
			string Ynamestr = m_vData_name.at(m_CoorBase_Idx);
			c->yAxis()->setTitle(Ynamestr.c_str(), "arialbi.ttf", 10);

			// Set the x-axis label format
			c->xAxis()->setLabelFormat("{value|hh:nn:ss}");

			///////////////////////////////////////////////////////////////////////////////////////
			// 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, "C0_L");
			//layer->addDataSet(viewPortDataSeriesB, 0x008800, "C0_R");

			//layer->addDataSet(viewPortDataSeriesC, 0x3333CC, "Gamma");


			//没有名字也会挂
			// 	m_vData_name.push_back("C0_L");
			// 	m_vData_name.push_back("C0_R");
			// 	m_vData_name.push_back("C0_T");

			//layer->setXData(viewPortTime[m_CoorBase_Idx]);
			layer->setXData(viewPortTime[m_CoorBase_Idx]);

			for (int i = 0; i < m_num; ++i)
			{
				layer->addDataSet(viewPortData[i],ColorSelection[i],m_vData_name.at(i).c_str());
			}



			///////////////////////////////////////////////////////////////////////////////////////
			// 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->syncLinearAxisWithViewPort("x", c->xAxis());

			///////////////////////////////////////////////////////////////////////////////////////
			// 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()) 
			{
				trackLineLegend(c, (0 == viewer->getChart()) ? c->getPlotArea()->getRightX() :
					viewer->getPlotAreaMouseX()); 
			}

			delete viewer->getChart();
			viewer->setChart(c);


			//////////////////////////////////////////////////////////////////////////
			delete []viewPortData;
			delete []viewPortTime;

  Re: how could i change the label of x-axis from hh:nn:ss format to seconds counted from the program start
Posted by Peter Kwan on Nov-09-2016 23:14
Hi JSF,

For your x-coordinates, such as m_dataXCoor or m_vvData_x[i], please use numbers representing elapsed time.

For example, when obtaining the data, instead of using the current date/time as the x-coordinates, you can do something like:

// declare as member variable
double m_beginTime;

.....

// during initialization
m_beginTime = -1;

....


//
// when adding data
//

// current elapsed time
double now = clock() / (double)CLOCKS_PER_SEC;

// save the elapsed time for the first data point
if (m_beginTime < 0)
    m_beginTime = now;

...

// use the time elapsed since the first data point as the x-coordinate
m_dataXCoor[m_currentIndex] = now - m_beginTime;

...


Also, please remove the line c->xAxis()->setLabelFormat("{value|hh:nn:ss}"); as it is not necessary.

Hope this can help.

Regards
Peter Kwan