<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Charts</title> <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" /> <link rel="stylesheet" type="text/css" href="../shared/example.css" /> <!-- GC --> <style> .x-tip { background-color: #fff; border-radius: 0.5em; -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; border-radius: 0.5em; border: 1px solid rgba(134, 84, 41, 0.5); opacity: 0.95; } .x-tip-header { margin-bottom: 5px; } .x-tip .x-panel .x-panel-body.x-layout-fit { border: none; } .x-tip .x-panel.x-grid-section.x-panel-noborder.x-fit-item { margin: 0; } .x-tip .x-panel.x-box-item { top: 0 !important; } .x-tip-header-body .x-component.x-box-item { width: 100%; text-align: center; } .x-tip-body { text-shadow: none; } .x-panel { margin: 20px; } ul { margin-left: 10px; } ul li { display: block; font-weight: normal; color: #444; padding: 2px; } h1 { font-size: 18px; margin: 10px; } </style> <script type="text/javascript" src="../../ext-all.js"></script> <script type="text/javascript" src="../example-data.js"></script> <script type="text/javascript" src="TipsChart.js"></script> </head> <body id="docbody"> <h1>Chart in tips example</h1> <div style="margin: 10px;"> Showing a Pie Chart and a Grid Panel as elements in a tooltip. <a href="TipsChart.js">View Source</a> </div> </body> </html>