v2.0.3
npm i @uiw/react-heat-map@2.0.3
- 📖 doc: Update README.md c4e3309 @jaywcjlove
- 🐞 fix: Fix kkt config. 93c79ee @jaywcjlove
- 💄 chore: update ts config. cf652c0 @jaywcjlove
- 🌍 website: fix example issue. 17547e3 @jaywcjlove
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>