- 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
Single View Enabled
Explore an example of a Heat.js instance configured to show only a single view enabled.
Include Files
Make sure you include the following files:
<link rel="stylesheet" href="dist/heat.js.min.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="getBindingOptions()"></div>
Add a new JavaScript function to return to binding options:
function getBindingOptions() {
return {
"views": {
"map": {
"enabled": true,
},
"line": {
"enabled": false,
},
"chart": {
"enabled": false,
},
"days": {
"enabled": false,
},
"months": {
"enabled": false,
},
"colorRanges": {
"enabled": false,
},
},
};
}