This example demonstrates how to modify the YUI Charts Control's styles to give it a custom appearance.
Please note: The YUI Charts Control requires Flash Player 9.0.45 or higher. The latest version of Flash Player is available at the Adobe Flash Player Download Center.
To change the visual appearance of a Charts Control instance, one uses the style
initialization attribute. Each part of the chart, including the background and border, xAxis and yAxis, and the dataTip may be customized.
Notice that the main font
style applies to both of the axes on the chart. The dataTip includes a custom border
and font
. The yAxis includes custom ticks and we hide the majorGridLines by setting the size
value to 0
.
The series definition includes style
values for both series with declarations for background images abd colors and the size of each marker.
The mode
value specifies how the image will be displayed. In this case "no-repeat"
ensures that the image will be displayed only once. Other possible values include "repeat"
, "repeat-x"
, "repeat-y"
, and "stretch"
.
Note: You are viewing this example in debug mode with logging enabled. This can significantly slow performance.
Copyright © 2008 Yahoo! Inc. All rights reserved.
Privacy Policy - Terms of Service - Copyright Policy - Job Openings