ASP.NET Core 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
    Core
    .wj-flexchart Styles the div host element of the FlexChart control.
    .wj-header .wj-title Styles the header element of the FlexChart control.
    .wj-footer .wj-title Styles the footer element of the FlexChart control.
    .wj-data-label Styles all the data label entries of the FlexChart control.
    .wj-labels Styles all the label elements that represents text in the FlexChart control including data labels, legend labels and axis labels.
    .wj-data-label-border Styles the data label border.
    .wj-data-label-line Styles the data label line.
    .wj-axis-x .wj-line Styles the x-axis line, which is displayed when the AxisLine property is set to true.
    .wj-axis-y .wj-line Styles the y-axis line, which is displayed when the AxisLine property is set to true.
    wj-plot-area Styles the rectangle plot area where the chart is rendered.
    wj-series-group Styles the area that is used to plot the series data in the FlexChart control.
    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.
    .wj-tick Styles the major tickmarks, which is displayed when the MajorTickMarks property is set to true.
    .wj-tick-minor Styles the minor tickmarks, which is displayed when the MinorTickMarks property is set to true.
    .wj-flexchart .wj-state-selected Styles the selected items in the FlexChart control.
    Interaction
    .wj-chart-linemarker Styles the line marker element of the FlexChart control.
    .wj-chart-linemarker-hline Styles the horizontal line marker.
    .wj-chart-linemarker-vline Styles the vertical line marker.
    wj-chart-linemarker-container Styles the div host element that includes the line marker container.
    .wj-chart-linemarker-draggable Styles the cursor that appears while dragging the the line marker.
    .wj-chart-rangeslider Styles the range slider added to the FlexChart control.
    .wj-rangeslider-content Styles the content area assigned to the range slider that displays the current value.
    .wj-rangeslider-rangehandle Styles the distance area between range slider min handle and range slider max handle.
    .wj-rangeslider-minhandle Styles the min handler of the range slider.
    .wj-rangeslider-maxhandle Styles the max handler of the range slider.
    .wj-rangeslider-handle-active Styles the currently selected min or max  range slider handler.
    .wj-glyph-left Styles the left-arrow icon displayed in the range slider.
    .wj-glyph-right Styles the right-arrow icon displayed in the range slider.
    .wj-glyph-down Styles the down-arrow icon displayed in the range slider.
    .wj-glyph-up Styles the up-arrow icon displayed in the range slider.
    .wj-chart-hrangeslider Styles the horizontal range slider added to the FlexChart control.
    .wj-chart-vrangeslider Styles the vertical range slider added to the FlexChart control.
    .wj-chart-rangeselector-container Styles the div host element that includes the range selector container.
    .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.