rms-sparklines
Version:
A sparkline collection, written as web components
58 lines (50 loc) • 2.34 kB
HTML
<!--
~ Copyright2018 Rodrigo Silveira
~
~ Permission is hereby granted, free of charge, to any person obtaining a copy of
~ this software and associated documentation files (the "Software"), to deal in
~ the Software without restriction, including without limitation the rights to
~ use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
~ the Software, and to permit persons to whom the Software is furnished to do so,
~ subject to the following conditions:
~
~ The above copyright notice and this permission notice shall be included in all
~ copies or substantial portions of the Software.
~
~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
~ FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
~ COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
~ IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
~ CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-->
<html>
<head>
<meta charset="utf-8">
<title>rms-sparkline-bar-chart demos</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="./node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
<script nomodule src="./node_modules/browser-es-module-loader/dist/babel-browser-build.js"></script>
<script nomodule src="./node_modules/browser-es-module-loader/dist/browser-es-module-loader.js"></script>
<script src="./dist/rms-sparkline-bar-chart.js" type="module"></script>
<style>
body {
background-color: #eee;
padding: 24px;
}
rms-sparkline-bar-chart {
margin: 8px;
}
rms-sparkline-bar-chart.blue {
--rms-sparkline-bar-chart-background-color: #03A9F4;
}
</style>
</head>
<body>
<rms-sparkline-bar-chart></rms-sparkline-bar-chart>
<rms-sparkline-bar-chart className="Pickle" width="Pickle" height="Pickle" lineColor="Pickle" lineWidth="Pickle" fillColor="Pickle" toolTip="Pickle"></rms-sparkline-bar-chart>
<rms-sparkline-bar-chart>Slot content</rms-sparkline-bar-chart>
<rms-sparkline-bar-chart class="blue"></rms-sparkline-bar-chart>
</body>
</html>