Difference between revisions of "Diagram 3"

From Catglobe Wiki
Jump to: navigation, search
(Created page with 'Image:Diagram 3.JPG The diagram above is a cross diagram which is made by crossing 2 axes together:<br>- The x-axis will be used a time set.<br>- The y-axis will be the ans…')
 
Line 7: Line 7:
 
<u>'''Step 1.'''</u>'''Create a new&nbsp;time set in&nbsp;Time set&nbsp;list.'''&nbsp;  
 
<u>'''Step 1.'''</u>'''Create a new&nbsp;time set in&nbsp;Time set&nbsp;list.'''&nbsp;  
  
−
'''1. Open the Data Cache in Data Cache list''' (Tools/Data/Data Caches)<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Dash 0.JPG]] .  
+
'''1. Open the Time set list (Tools/ Administration / Report/ Time sets).'''
 +
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Dash 0.JPG]] .  
  
−
<br>'''&nbsp;2. In the Data Cache tab:'''&nbsp;  
+
<br>'''&nbsp;2.&nbsp;Create a new Time set :'''&nbsp;
  
−
&nbsp;&nbsp; '''2.1 Select Column’s type then click “Add Column” button to insert a new Custom column'''<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Add custom.JPG]]&nbsp;  
+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Add custom.JPG]]&nbsp;  
  
 
<br>
 
<br>
  
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; - A new Custom column is used to define the&nbsp;quarters.  
+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; - The new Time set is used to define the period of time.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;- Type: Month <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; - Label format : select type likes "Sep 2009"<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;- Span : select 6 if user want to show value for each 6 months, or select Span = 3 if user want to show value for each quarter.&nbsp;
  
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;- Data type&nbsp;: Number&nbsp;
+
&nbsp;&nbsp; '''3''''''. Save the&nbsp;Time set.'''  
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; - Save numbers&nbsp;: 0,1,4 and null.
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 0&nbsp;: if the&nbsp;date of the EndDate column is the same quarter with the current&nbsp;date in the system
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 1&nbsp;: if the&nbsp;date of the EndDate column is in the previous&nbsp;quarter of current&nbsp;date in the system.
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4&nbsp;: if the&nbsp;date of the EndDate column is in the&nbsp;same quarter but in last&nbsp;year of current&nbsp;date in the system.
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Null&nbsp;: if the&nbsp;date of the EndDate column is in other quarters.
 
−
 
 
−
&nbsp;&nbsp; '''2.2 Put the CGScript which defines Current Year and Last Year'''<br><span id="fck_dom_range_temp_1251961601465_789">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Insert script.JPG|693x230px]]</span>&nbsp;
 
−
 
 
−
- Input Name of the Custom column, this name will be an option of the axis set.
 
−
 
 
−
- Insert the CGSript.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>
 
−
 
 
−
{| style="width: 634px; height: 296px" border="1" cellspacing="1" cellpadding="1" width="634"
 
−
|-
 
−
| // CGScript<br>&nbsp;
 
−
array a = DateTime_parse(EndDate, "MM/dd/yyyy");
 
−
 
 
−
array today = getDateTime();
 
−
 
 
−
number todayYear = today[DateTime_Year];
 
−
 
 
−
number todayMonth = today[DateTime_Month];
 
−
 
 
−
number TodayQuarter = 1;
 
−
 
 
−
number endDateQuarter = 1;
 
−
 
 
−
number IsLastQuarter = 1;
 
−
 
 
−
number IsThisQuarter = 0;
 
−
 
 
−
number IsSameQuarterLastYear = 4;
 
−
 
 
−
if (todayMonth == 1 &#124;&#124; todayMonth == 2 &#124;&#124; todayMonth == 3)
 
−
 
 
−
TodayQuarter = 1;
 
−
 
 
−
else if (todayMonth == 4 &#124;&#124; todayMonth == 5 &#124;&#124; todayMonth == 6)
 
−
 
 
−
TodayQuarter = 2;
 
−
 
 
−
else if (todayMonth == 7 &#124;&#124; todayMonth == 8 &#124;&#124; todayMonth == 9)
 
−
 
 
−
TodayQuarter = 3;
 
−
 
 
−
else TodayQuarter = 4;
 
−
 
 
−
if (a[1] == 1 &#124;&#124; a[1] == 2 &#124;&#124; a[1] == 3)
 
−
 
 
−
endDateQuarter = 1;
 
−
 
 
−
else if (a[1] == 4 &#124;&#124; a[1] == 5 &#124;&#124; a[1] == 6)
 
−
 
 
−
endDateQuarter = 2;
 
−
 
 
−
else if (a[1] == 7 &#124;&#124; a[1] == 8 &#124;&#124; a[1] == 9)
 
−
 
 
−
endDateQuarter = 3;
 
−
 
 
−
else endDateQuarter = 4;
 
−
 
 
−
if (a[0] == todayYear &amp;&amp; endDateQuarter == TodayQuarter)
 
−
 
 
−
return IsThisQuarter;
 
−
 
 
−
else if (a[0] == todayYear &amp;&amp; TodayQuarter - endDateQuarter == 1)
 
−
 
 
−
return IsLastQuarter;
 
−
 
 
−
else if (todayYear - a[0] == 1 &amp;&amp; endDateQuarter == TodayQuarter)
 
−
 
 
−
return IsSameQuarterLastYear;
 
−
 
 
−
//End Script
 
−
 
 
−
|}
 
−
 
 
−
- Save the Custom column.
 
−
 
 
−
&nbsp;'''3. Go to the Axis set tab''''': ''Create a new axis set'''&nbsp;'''&nbsp;'''''&nbsp;&nbsp;'''''
 
−
 
 
−
'''''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;'''3.1 Create a new axis set<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ''''''[[Image:Create new axis.JPG|269x392px]]'''&nbsp;
 
−
 
 
−
<br>
 
−
 
 
−
&nbsp;&nbsp;''3.2 Input value to the new axis set''
 
−
 
 
−
'''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Input value.JPG]]'''&nbsp;
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Axis math – base, Axis pct – base, Option value&nbsp;: will be used the Custom column’s name.
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; For example&nbsp;:<br>
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Example.JPG|696x323px]]&nbsp;
 
−
 
 
−
&nbsp;&nbsp;'''4. Save the Data cache.'''  
 
  
 
'''<u>Step 2. </u>Create Dashboard item whose type is Cross diagram.'''&nbsp;&nbsp;  
 
'''<u>Step 2. </u>Create Dashboard item whose type is Cross diagram.'''&nbsp;&nbsp;  
Line 126: Line 26:
 
&nbsp;&nbsp; '''2. Create a new dashboard or edit an existing one.&nbsp;'''&nbsp;&nbsp;  
 
&nbsp;&nbsp; '''2. Create a new dashboard or edit an existing one.&nbsp;'''&nbsp;&nbsp;  
  
−
'''&nbsp;&nbsp; 3. In General Information tab''': Data caches list must have the DCS which is created at step 1.  
+
'''&nbsp;&nbsp; 3. In General Information tab''': Data caches list must have the DCS which is used to make Cross diagram.
  
 
&nbsp;&nbsp; '''4. Layout tab''': Create Dashboard items.  
 
&nbsp;&nbsp; '''4. Layout tab''': Create Dashboard items.  
  
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 4.1 Create Dashboard (DB) item 1 whose type is Shown axis.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Dash 2.JPG]]
+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 4.1 Create Dashboard (DB) item 1 whose type is&nbsp;Time set.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; [[Image:Dash 2.JPG]]  
−
 
 
−
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache: use the DCS which is created at step 1.
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;o This DB item will be used as the X-axis of the cross diagram&nbsp;that has&nbsp;4 options:&nbsp;Custom Service, Product, Web site and Brand.&nbsp;
 
−
 
 
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4.2 Create Dashboard (DB) item 2 whose type is Shown axis.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; [[Image:Dash 2.JPG]]&nbsp;
 
  
−
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache&nbsp;: use the DCS which is created at step 1.  
+
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache: use the DCS which is used to make Cross diagram.<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Time set : select the Time set which is created at step 1. <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Column : select EndDate&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Start date : select the 1st of June.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4.2 Create Dashboard (DB) item 2 whose type is Shown axis.&nbsp;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; [[Image:Dash 2.JPG]]&nbsp;
  
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;o This DB item will be used as Y-axis&nbsp;of the cross diagram&nbsp;that has&nbsp;3 options:&nbsp;Same Quarter Last Year, This Quarter and Last Quarter.
+
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache : use the DCS which is used to make Cross diagram. <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o This DB item will be used as the y-axis of the cross diagram.&nbsp;
  
 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4.3 Create Dashboard (DB) item 3 whose type is Cross diagram&nbsp;:<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; [[Image:Dash 3.JPG]]&nbsp;  
 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;4.3 Create Dashboard (DB) item 3 whose type is Cross diagram&nbsp;:<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; [[Image:Dash 3.JPG]]&nbsp;  
Line 146: Line 40:
 
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache: use the DCS which is created at step 1.  
 
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o Data cache: use the DCS which is created at step 1.  
  
−
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;o Chart type:&nbsp;Bar
+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;o Chart type:&nbsp;Line
  
 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o X – axis: must be DB item 4.1  
 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; o X – axis: must be DB item 4.1  

Revision as of 08:55, 10 September 2009

Diagram 3.JPG

The diagram above is a cross diagram which is made by crossing 2 axes together:
- The x-axis will be used a time set.
- The y-axis will be the answer option which used to shown its value.

The following steps show you how to create the above diagram

Step 1.Create a new time set in Time set list. 

1. Open the Time set list (Tools/ Administration / Report/ Time sets).            Dash 0.JPG .


 2. Create a new Time set : 

                                    Add custom.JPG 


           - The new Time set is used to define the period of time. 
           - Type: Month
           - Label format : select type likes "Sep 2009"
           - Span : select 6 if user want to show value for each 6 months, or select Span = 3 if user want to show value for each quarter. 

   3'. Save the Time set.'

Step 2. Create Dashboard item whose type is Cross diagram.  

     1. Go to Dashboard list (Tools/ Reports/ Dashboard).
         Dash 1.JPG 

   2. Create a new dashboard or edit an existing one.   

   3. In General Information tab: Data caches list must have the DCS which is used to make Cross diagram.

   4. Layout tab: Create Dashboard items.

      4.1 Create Dashboard (DB) item 1 whose type is Time set. 
         Dash 2.JPG


         o Data cache: use the DCS which is used to make Cross diagram.
          o Time set : select the Time set which is created at step 1.
          o Column : select EndDate 
          o Start date : select the 1st of June. 
      4.2 Create Dashboard (DB) item 2 whose type is Shown axis. 
          Dash 2.JPG 


         o Data cache : use the DCS which is used to make Cross diagram.
         o This DB item will be used as the y-axis of the cross diagram. 

      4.3 Create Dashboard (DB) item 3 whose type is Cross diagram :
         Dash 3.JPG 


         o Data cache: use the DCS which is created at step 1.

         o Chart type: Line

         o X – axis: must be DB item 4.1

         o Y – axis: must be DB item 4.2

         o Style sheet: choose a style sheet which is created in the Style sheet list.

         o Data format: absolute

         o Direction: Vertical

   5. Insert these Dashboard items to the HTML editor then save the Dashboard.

// Finish creating the diagram.  

Retrieved from "http://wiki.catglobe.com/index.php?title=Diagram_3&oldid=7618"