ASP.NET MVC Controls | ComponentOne
Working with Controls / FlexChart / Work with FlexChart / Styling and CSS
In This Topic
    Styling and CSS
    In This Topic

    CSS Classes for the FlexChart control are as follows:

    Class Description
    .wj-flexchart Styles the div host element of the FlexChart control.
    .wj-header .wj-title Styles the header element.
    .wj-footer .wj-title Styles the footer element.
    .wj-label Styles the text for axis labels and legend labels.
    Axis
    .wj-axis-x .wj-line Styles the x-axis line.
    .wj-axis-y .wj-line Styles the y-axis line.
    .wj-axis-x .wj-title Styles the x-axis title.
    .wj-axis-y .wj-title Styles the y-axis title.
    .wj-axis-x .wj-label  Styles the x-axis labels.
    .wj-axis-y .wj-label Styles the y-axis labels.
    .wj-tick Styles the tick marks
    .wj-axis-x .wj-tick Styles the x-axis tick marks.
    .wj-axis-y .wj-tick Styles the y-axis tick marks.
    .wj-tick-minor Styles the minor tick marks.
    .wj-axis-x .wj-tick-minor Styles the minor tick marks on x-axis, which are displayed when the MinorTickMarks property is set to true.
    .wj-axis-y .wj-tick-minor Styles the minor tick marks on y-axis, which are displayed when the MinorTickMarks property is set to true.
    Plot Area
    .wj-plot-area>rect Styles the plot area of the chart.
    .wj-gridline Styles the major gridlines, which is displayed when the MajorGrid property is set to true.
    .wj-gridline-minor Styles the minor gridlines, which is displayed when the MinorGrid property is set to true.
    Legends
    .wj-legend > rect Styles the legends of the chart.
    .wj-legend .wj-label Styles the labels for each chart legend entries.
    Data Labels
    .wj-data-label Styles all the data labels for each data point.
    .wj-data-label-border Styles the data label border
    .wj-data-label-line Styles the data label line.
    Selection
    .wj-flexchart .wj-state-selected Styles the selected items in the FlexChart control, when SelectionMode property is set to series or point.
    Interaction
    .wj-flexchart .wj-chart-linemarker .wj-chart-linemarker-hline Styles the horizontal line marker.
    .wj-flexchart .wj-chart-linemarker .wj-chart-linemarker-vline Styles the vertical line marker.
    .wj-chart-linemarker-container Styles the div host element that includes the line marker content.
    .wj-flexchart .wj-chart-linemarker-draggable Styles the cursor that appears while dragging the line marker.
    .wj-chart-rangeslider .wj-chart-hrangeslider Styles the range slider.
    .wj-flexchart .wj-chart-rangeslider .wj-rangeslider-rangehandle Styles the range slider bar.
    .wj-chart-rangeslider button Styles the button of range slider.
    .wj-chart-rangeslider .wj-rangeslider-content Styles the content of range slider.
    .wj-chart-hrangeslider Styles the horizontal range slider.
    .wj-chart-hrangeslider .wj-rangeslider-minhandle Styles the min handle of horizontal range slider.
    .wj-chart-hrangeslider .wj-rangeslider-maxhandle Styles the max handle of horizontal range slider.
    .wj-chart-vrangeslider Styles the vertical range slider.
    .wj-chart-vrangeslider .wj-rangeslider-minhandle Styles the min handle of vertical range slider.
    .wj-chart-vrangeslider .wj-rangeslider-maxhandle Styles the max handle of vertical range slider.
    .wj-rangeslider-maxhandle .wj-rangeslider-handle-active Styles the currently selected max range slider handler.
    .wj-rangeslider-minhandle .wj-rangeslider-handle-active Styles the currently selected min range slider handler.
    .wj-panable Styles the cursor that appears while performing the panning operation on the FlexChart control.
    .wj-zoom-overlay Styles the highlighting zooming area on the chart.