Skip to content

v2.0.3

Compare
Choose a tag to compare
@github-actions github-actions released this 27 Feb 16:19
· 44 commits to main since this release

npm bundle size

npm i @uiw/react-heat-map@2.0.3

v2.0.2...v2.0.3

Bundle Example: https://uiwjs.github.io/react-heat-map/bundle.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <script src="https://unpkg.com/@babel/standalone@7.17.5/babel.min.js" crossorigin></script>
    <script src="https://unpkg.com/react@16.x/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@16.x/umd/react-dom.development.js" crossorigin></script>
    <script src="https://unpkg.com/@uiw/codepen-require-polyfill/index.js" crossorigin></script>
    <link rel="stylesheet" href="https://unpkg.com/@uiw/react-heat-map/dist/heat-map.css">
  </head>
  <body>
    <div id="container" style="padding: 24px"></div>
    <script src="https://unpkg.com/@uiw/react-heat-map/dist/heat-map.min.js"></script>
    <script type="text/babel">
      import HeatMap from '@uiw/react-heat-map';

      const value = [
        { date: '2016/01/11', count: 2 },
        { date: '2016/01/12', count: 20 },
        { date: '2016/01/13', count: 10 },
        ...[...Array(17)].map((_, idx) => ({ date: `2016/02/${idx + 10}`, count: idx, content: '' })),
        { date: '2016/04/11', count: 2 },
        { date: '2016/05/01', count: 5 },
        { date: '2016/05/02', count: 5 },
        { date: '2016/05/04', count: 11 },
      ];

      const Demo = () => {
        return (
          <HeatMap value={value} startDate={new Date('2016/01/01')} />
        );
      };

      ReactDOM.render(<Demo />, document.getElementById('container'));
    </script>
  </body>
</html>