Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(3)

Unified Diff: packages/charted/examples/charts/demo_interactive.html

Issue 1400473008: Roll Observatory packages and add a roll script (Closed) Base URL: git@github.com:dart-lang/observatory_pub_packages.git@master
Patch Set: Created 5 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: packages/charted/examples/charts/demo_interactive.html
diff --git a/packages/charted/examples/charts/demo_interactive.html b/packages/charted/examples/charts/demo_interactive.html
new file mode 100644
index 0000000000000000000000000000000000000000..f84401075154d327342cd5e2c46131514d60a863
--- /dev/null
+++ b/packages/charted/examples/charts/demo_interactive.html
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>Charted &mdash; Interactive demo</title>
+ <link rel="stylesheet" href="demo_charts.css">
+ <link rel="stylesheet" href="packages/charted/charts/themes/quantum_theme.css">
+ <style>
+ body {
+ padding: 0;
+ margin: 0;
+ }
+ .controls {
+ padding: 30px;
+ border-right: 1px solid #d3d3d3;
+ background-color: #eee;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ overflow: auto;
+ min-width: 250px;
+ max-width: 250px;
+ position: fixed;
+ height: 100%;
+ }
+ .control-category {
+ padding: 10px 0;
+ border-bottom: 1px solid #ccc;
+ }
+ .control-category:last-child {
+ border-bottom: 0;
+ }
+ button, select {
+ margin-bottom: 10px;
+ }
+ .chart-wrapper {
+ min-width: 600px;
+ max-width: 1000px;
+ margin-left: 325px;
+ }
+ </style>
+ </head>
+ <body>
+ <div class="controls">
+ <div class="controls-inner">
+ <h1 class="title">Charted &mdash; Interactive demo</h1>
+ <div class="control-category">
+ <h2>Series</h2>
+ <select id="select-series"></select>
+ <button id="add-series">+</button>
+ <button id="remove-series">-</button>
+
+ <h2>Series renderer</h2>
+ <select id="select-renderer"></select>
+
+ <h2>Columns in series</h2>
+ <div id="column-buttons"></div>
+ </div>
+ <div class="control-category">
+ <h2>Data rows</h2>
+ <button id="add-row">Add row</button>
+ <button id="remove-row">Remove last row</button>
+ </div>
+ <div class="control-category">
+ <h2>Internationalization</h2>
+ <div>
+ <input type="checkbox" id="rtl-use-script"/>
+ <label for="rtl-use-script">Use RTL script</label>
+ </div>
+ <div>
+ <input type="checkbox" id="rtl-use-layout"/>
+ <label for="rtl-use-layout">Use RTL Layout</label>
+ </div>
+ <div>
+ <input type="checkbox" id="rtl-switch-axes" disabled/>
+ <label for="rtl-switch-axes">Switch axis direction for RTL</label>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="chart-wrapper">
+ <div class="chart-title-wrapper">
+ <div class="chart-title">Interactive chart demo</div>
+ <div class="chart-subtitle">Use the left panel to customize chart</div>
+ </div>
+ <div class="chart-host-wrapper">
+ <div class="chart-host" dir="ltr"></div>
+ <div class="chart-legend-host"></div>
+ </div>
+ </div>
+ <script type="application/dart" src="demo_interactive.dart"></script>
+ <script src="packages/browser/dart.js"></script>
+ </body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698