HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
3
// create data
4
var data = [
5
{x: "2010", y: "A", heat: 15},
6
{x: "2011", y: "A", heat: 17},
7
{x: "2012", y: "A", heat: 21},
8
{x: "2013", y: "A", heat: 23},
9
{x: "2010", y: "B", heat: 34},
10
{x: "2011", y: "B", heat: 33},
11
{x: "2012", y: "B", heat: 32},
12
{x: "2013", y: "B", heat: 30},
13
{x: "2010", y: "C", heat: 43},
14
{x: "2011", y: "C", heat: 42},
15
{x: "2012", y: "C", heat: 40},
16
{x: "2013", y: "C", heat: 38},
17
{x: "2010", y: "D", heat: 8},
18
{x: "2011", y: "D", heat: 8},
19
{x: "2012", y: "D", heat: 7},
20
{x: "2013", y: "D", heat: 8}
21
];
22
23
// create a chart and set the data
24
var chart = anychart.heatMap(data);
25
26
// create and configure a color scale.
27
var customColorScale = anychart.scales.linearColor();
28
customColorScale.colors(["#00ccff", "#ffcc00"]);
29
30
// set the color scale as the color scale of the chart
31
chart.colorScale(customColorScale);
32
33
// set the chart title
34
chart.title("Heat Map: Color Scale (Linear)");
35
36
// set the container id
37
chart.container("container");
38
39
// initiate drawing the chart
40
chart.draw();
41
});