ComponentOne Extender Controls for ASP.NET Web Forms
Wijmo Control Toolkit Extender Controls / Chart Extenders / C1ScatterChartExtender / Changing the Marker for the Scatter Chart
In This Topic
    Changing the Marker for the Scatter Chart
    In This Topic

    To create diamond markers instead of circles, use the SeriesList’s Markers property to define the type of marker used. You can choose from Circle, Tri, InvertedTri, Box, Diamond or Cross.

    This topic illustrates how to change marker type in Design view and in Source view.

    Changing the Marker Type in Design View:

    To change the marker type of your C1ScatterChart, follow these steps:

    1. Select View | Properties Window in the Visual Studio menu.
    2. Click the drop-down list at the top of the Properties window and select Panel1_C1ScatterChartExtender.
    3. Click the ellipsis button next to the SeriesList property. The ScatterChartSeries Collection Editor appears.
    4. Select the series from the Members list that you wish to change its marker type. In this example we’ll select the first series from the Members list.
    5. Select the dropdown arrow next to the MarkerType and then choose Diamond.
    6. Cick OK.

    The Diamond marker type is applied to the ScatterChartSeries.

    Changing the Marker Type in Source View

    To change the marker type for the first series in Source view, add <Markers Type="Diamond"></Markers> tag so that the tag resembles the following:

    <cc1:C1ScatterChartExtender ID="Panel1_C1ScatterChartExtender" runat="server"

                TargetControlID="Panel1">

                <seriestransition duration="2000" enabled="False">

                </seriestransition>

                <animation duration="2000" enabled="False">

                </animation>

                            <SeriesList>

                    <cc1:ScatterChartSeries LegendEntry="False" MarkerType="Diamond">

                        <Data>

                            <X>

                                <Values>

                                    <cc1:ChartXData DoubleValue="0" />

                                    <cc1:ChartXData DoubleValue="1" />

                                    <cc1:ChartXData DoubleValue="2" />

                                    <cc1:ChartXData DoubleValue="3" />

                                    <cc1:ChartXData DoubleValue="4" />

                                    <cc1:ChartXData DoubleValue="5" />

                                    <cc1:ChartXData DoubleValue="7" />

                                    <cc1:ChartXData DoubleValue="7" />

                                    <cc1:ChartXData DoubleValue="8" />

                                    <cc1:ChartXData DoubleValue="9" />

                                    <cc1:ChartXData DoubleValue="10" />

                                    <cc1:ChartXData DoubleValue="11" />

                                    <cc1:ChartXData DoubleValue="13" />

                                    <cc1:ChartXData DoubleValue="15" />

                                    <cc1:ChartXData DoubleValue="16" />

                                    <cc1:ChartXData DoubleValue="17" />

                                    <cc1:ChartXData DoubleValue="17.5" />

                                    <cc1:ChartXData DoubleValue="18" />

                                    <cc1:ChartXData DoubleValue="20" />

                                    <cc1:ChartXData DoubleValue="21" />

                                    <cc1:ChartXData DoubleValue="22" />

                                    <cc1:ChartXData DoubleValue="23" />

                                    <cc1:ChartXData DoubleValue="24" />

                                    <cc1:ChartXData DoubleValue="25" />

                                    <cc1:ChartXData DoubleValue="25.5" />

                                    <cc1:ChartXData DoubleValue="26" />

                                </Values>

                            </X>

                            <Y>

                                <Values>

                                    <cc1:ChartYData DoubleValue="1" />

                                    <cc1:ChartYData DoubleValue="1" />

                                    <cc1:ChartYData DoubleValue="1.5" />

                                    <cc1:ChartYData DoubleValue="3" />

                                    <cc1:ChartYData DoubleValue="4" />

                                    <cc1:ChartYData DoubleValue="8" />

                                    <cc1:ChartYData DoubleValue="7.5" />

                                    <cc1:ChartYData DoubleValue="11" />

                                    <cc1:ChartYData DoubleValue="10" />

                                    <cc1:ChartYData DoubleValue="12" />

                                    <cc1:ChartYData DoubleValue="16" />

                                    <cc1:ChartYData DoubleValue="11" />

                                    <cc1:ChartYData DoubleValue="11" />

                                    <cc1:ChartYData DoubleValue="16" />

                                    <cc1:ChartYData DoubleValue="18" />

                                    <cc1:ChartYData DoubleValue="17" />

                                    <cc1:ChartYData DoubleValue="17.5" />

                                    <cc1:ChartYData DoubleValue="17.5" />

                                    <cc1:ChartYData DoubleValue="20" />

                                    <cc1:ChartYData DoubleValue="20" />

                                    <cc1:ChartYData DoubleValue="20" />

                                    <cc1:ChartYData DoubleValue="21" />

                                    <cc1:ChartYData DoubleValue="21" />

                                    <cc1:ChartYData DoubleValue="21.5" />

                                    <cc1:ChartYData DoubleValue="25" />

                                    <cc1:ChartYData DoubleValue="28" />

                                </Values>

                            </Y>

                        </Data>

                    </cc1:ScatterChartSeries>

                    </SeriesList>

                <footer compass="South" visible="False">

                </footer>

                <legend>

                    <size height="3" width="30">

                    </size>

                </legend>

                <axis>

                    <y compass="West" visible="False">

                        <labels textalign="Center">

                        </labels>

                        <gridmajor visible="True">

                        </gridmajor>

                    </y>

                </axis>

            </cc1:C1ScatterChartExtender>

    This Topic Illustrates the Following:

    The following image shows a C1ScatterChart having a diamond marker type: