A legend may be displayed with the YUI Charts Control by setting a few simple styles. This example shows you how.
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.
The Charts Control may display a legend by specifying the legend display style. Accepted values include "top"
, "right"
, "bottom"
, "left"
, and the default value "none"
.
Legends that are displayed on the left or right sides will arrange their series or category items vertically. When you specify that the legend should be displayed on the top or bottom, it will arrange its items horizontally.
Several substyles are available to allow you to customize the legend to fit your needs. In this example, we customize the font used by the text in the legend, the padding between the legend's items and the edge of the legend, and the spacing between the legend's items.
There are more styles available for legends, including border and background options. For full details about the legend styles, read the Charts Control User's Guide.
You can load the necessary JavaScript and CSS for this example from Yahoo's servers. Click here to load the YUI Dependency Configurator with all of this example's dependencies preconfigured.
Note: You are viewing this example in debug mode with logging enabled. This can significantly slow performance.
Copyright © 2011 Yahoo! Inc. All rights reserved.
Privacy Policy - Terms of Service - Copyright Policy - Job Openings