12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758 |
- <!DOCTYPE html>
- <html lang="en-US">
- <head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=Edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>chartjs-plugin-datalabels / samples</title>
- <link rel="stylesheet" type="text/css" href="index.css">
- <link rel="icon" type="image/ico" href="favicon.ico">
- <script src="samples.js"></script>
- <script src="utils.js"></script>
- </head>
- <body>
- <div id="header">
- <div class="title">
- <span class="main">chartjs-plugin-datalabels</span>
- <span class="name">Samples</span>
- </div>
- <div class="caption"><a href="http://www.chartjs.org">Chart.js</a> plugin to display labels on data</div>
- <div class="links">
- <a class="btn btn-docs" href="https://chartjs-plugin-datalabels.netlify.com">Documentation</a>
- <a class="btn btn-gh" href="https://github.com/chartjs/chartjs-plugin-datalabels">GitHub</a>
- </div>
- </div>
- <div id="categories"></div>
- <script>
- function createCategory(item) {
- var el = document.createElement('div');
- el.className = 'samples-category';
- el.innerHTML =
- '<div class="title">' + item.title + '</div>' +
- '<div class="items"></div>';
- return el;
- }
- function createEntry(item) {
- var el = document.createElement('div');
- el.className = 'samples-entry';
- el.innerHTML = '<a class="title" href="' + item.path + '">' + item.title + '</a>';
- return el;
- }
- var categories = document.getElementById('categories');
- Samples.items.forEach(function(item) {
- var category = createCategory(item);
- var children = category.getElementsByClassName('items')[0];
- (item.items || []).forEach(function(item) {
- children.appendChild(createEntry(item));
- });
- categories.appendChild(category);
- });
- </script>
- </body>
- </html>
|