I am using a scatter chart to show the results for some tests that a student has taken. I have added horizontal trendlines so that I can color in the graph to visibly display the proficiency range. Additionally I have added vertical lines between each point, which represents the result of a given test.
The result is that I show a point for each test, with a label at the bottom for the test name. There are vertical lines between each point, added for clarity. The bottom to the top of the graph is 0% - 100%. 0% to 60% is bound by a trendline, 60% - 80% is bound by a trendline, and 80% -100% is bound by a trendline so that each zone (0% - 100%, 60% - 80%, 80% -100%) is colored differently. The whole goal is to provide a quick snapshot to the instructor to see how the student is performing.
I understand that I am not truly creating a graph, but I am leveraging the available features to show something else, which brings me to my question.
The final test that I want to show has different zones than I stated above. It would visually make it look like a "step" is in the final column on the graph. I want to use 0% - 100%, 60% - 85%, 85% -100%. Here is an example of what I want to achieve:
Here is an exapmle of what I have been able to do:
sChart = "<graph palette='2' canvasBorderThickness='0' chartRightMargin='0' yAxisName='Percent Correct' xAxisMaxValue='100' xAxisMinValue='0' yAxisMinValue='0' yAxisMaxValue='100' numberSuffix='%25' showLegend='0' bgColor='FFFFFF' showBorder='0' showAlternateHGridColor='0' >";
sChart += "<categories verticalLineColor='666666' verticalLineThickness='1'>";
sChart += "<category x='10' label='Step 1 Word Study'/>";
sChart += "<category x='20' showVerticalLine='1' />";
sChart += "<category x='30' label='Step 3 Vocabulary'/>";
sChart += "<category x='40' showVerticalLine='1'/>";
sChart += "<category x='50' label='Step 3 Word Relationship'/>";
sChart += "<category x='60' showVerticalLine='1'/>";
sChart += "<category x='70' label='Step 3 Morphology'/>";
sChart += "<category x='80' showVerticalLine='1'/>";
sChart += "<category x='90' label='Step 4 Grammar'/>";
sChart += "<category x='100' showVerticalLine='1'/>";
sChart += "<category x='110' label='Step 4 Sentence Structure'/>";
sChart += "<category x='120' showVerticalLine='1'/>";
sChart += "<category x='130' label='Steps 1, 3 and 4 Total Score'/>";
sChart += "<category x='140' showVerticalLine='1'/>";
sChart += "</categories>";
sChart += "<dataset seriesName='Server 1' color='0000FF' anchorSides='4' anchorRadius='4' anchorBgColor='C6C6FF' anchorBorderColor='0000FF' showValues='1' >";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step1Score"].ToString() + "' x='10'/>";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step3AScore"].ToString() + "' x='30'/>";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step3BScore"].ToString() + "' x='50'/>";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step3CScore"].ToString() + "' x='70'/>";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step4AScore"].ToString() + "' x='90' />";
sChart += "<set y='" + ds.Tables[0].Rows[0]["Step4BScore"].ToString() + "' x='110' />";
sChart += "<set y='" + Average.ToString() + "' x='130' />";
sChart += "</dataset>";
sChart += "<trendlines >";
sChart += "<line startValue='0' endValue='60.0' isTrendZone='1' valueOnRight='0' color='" + Reteach_Color.ToString() + "' displayValue=' ' />";
sChart += "<line startValue='60' endValue='80.0' isTrendZone='1' valueOnRight='0' color='" + Reinforce_Color.ToString() + "' displayValue=' ' />";
sChart += "<line startValue='80.0' endValue='100.0' isTrendZone='1' valueOnRight='0' color='" + Mastery_Color.ToString() + "' displayValue=' ' />";
sChart += "</trendlines>";
sChart += "</graph>";
Is there a way to do what I want to do? If so, how?
Thanks
