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 a data set
4
var data = anychart.data.set([
5
["John", 10000, 12500],
6
["Jake", 12000, 15000],
7
["Peter", 13000, 16500,
8
{fill: "#5cd65c", stroke: "#5cd65c"},
9
{fill: "#009933", stroke: "#009933",
10
marker: {enabled: true},
11
label: {enabled: true}
12
},
13
{hatchFill: "forward-diagonal",
14
marker: {enabled: true},
15
label: {enabled: true}
16
}
17
],
18
["James", 10000, 13000],
19
["Mary", 9000, 11000]
20
]);
21
22
// map the data
23
var seriesData_1 = data.mapAs({
24
x: 0, value: 1,
25
normal: 3, hovered: 5, selected: 5
26
});
27
28
var seriesData_2 = data.mapAs({
29
x: 0, value: 2,
30
normal: 4, hovered: 5, selected: 5
31
});
32
33
// create a chart
34
var chart = anychart.column();
35
36
// create two series and set the data
37
var series1 = chart.column(seriesData_1);
38
var series2 = chart.column(seriesData_2);
39
40
// set the chart title
41
chart.title("States: Points (Mapping)");
42
43
// set the container id
44
chart.container("container");
45
46
// initiate drawing the chart
47
chart.draw();
48
});