- Basic
- Basic Default View
- Assign Custom Triggers
- Using Trend Types
- Setup
- Dynamic Colors
- Locale (different languages)
- Themes
- Layout
- Yearly Statistics
- Description
- Extra Title Bar Buttons
- Zooming
- Make Resizable
- Views
- Map
- Line
- Chart
- Days
- Months
- Color Ranges
- Options
- Show Counts
- Remove Map Month Gaps
- Remove Map Spacing
- Single View Enabled
- Show Title Menu
- Different Month Range
- Editable Trend Types
Themes
Explore an example of a Heat.js instance that uses a different theme.
Include Files
Make sure you include the following files:
<link rel="stylesheet" href="dist/heat.js.min.css">
<link rel="stylesheet" href="dist/themes/light/heat.js.light.red.theme.css">
<script src="dist/heat.min.js"></script>
Create DOM Element
Add a new DOM element to house the Heat.js instance:
<div id="heat-map" id="heat-map" data-heat-js="{}"></div>