TipsChart.html 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. <title>Charts</title>
  6. <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
  7. <link rel="stylesheet" type="text/css" href="../shared/example.css" />
  8. <!-- GC -->
  9. <style>
  10. .x-tip {
  11. background-color: #fff;
  12. border-radius: 0.5em;
  13. -moz-border-radius: 0.5em;
  14. -webkit-border-radius: 0.5em;
  15. border-radius: 0.5em;
  16. border: 1px solid rgba(134, 84, 41, 0.5);
  17. opacity: 0.95;
  18. }
  19. .x-tip-header {
  20. margin-bottom: 5px;
  21. }
  22. .x-tip .x-panel .x-panel-body.x-layout-fit {
  23. border: none;
  24. }
  25. .x-tip .x-panel.x-grid-section.x-panel-noborder.x-fit-item {
  26. margin: 0;
  27. }
  28. .x-tip .x-panel.x-box-item {
  29. top: 0 !important;
  30. }
  31. .x-tip-header-body .x-component.x-box-item {
  32. width: 100%;
  33. text-align: center;
  34. }
  35. .x-tip-body {
  36. text-shadow: none;
  37. }
  38. .x-panel {
  39. margin: 20px;
  40. }
  41. ul {
  42. margin-left: 10px;
  43. }
  44. ul li {
  45. display: block;
  46. font-weight: normal;
  47. color: #444;
  48. padding: 2px;
  49. }
  50. h1 {
  51. font-size: 18px;
  52. margin: 10px;
  53. }
  54. </style>
  55. <script type="text/javascript" src="../../ext-all.js"></script>
  56. <script type="text/javascript" src="../example-data.js"></script>
  57. <script type="text/javascript" src="TipsChart.js"></script>
  58. </head>
  59. <body id="docbody">
  60. <h1>Chart in tips example</h1>
  61. <div style="margin: 10px;">
  62. Showing a Pie Chart and a Grid Panel as elements in a tooltip. <a href="TipsChart.js">View Source</a>
  63. </div>
  64. </body>
  65. </html>