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: "learning", value: 80},
6
{x: "includes", value: 56},
7
{x: "lists", value: 44},
8
{x: "meaning", value: 40},
9
{x: "useful", value: 36},
10
{x: "different", value: 32},
11
{x: "grammar", value: 28},
12
{x: "teaching", value: 24},
13
{x: "example", value: 20},
14
{x: "thing", value: 12}
15
];
16
17
// create a chart and set the data
18
var chart = anychart.tagCloud(data);
19
20
// create and configure a color scale.
21
var customColorScale = anychart.scales.linearColor();
22
customColorScale.colors(["#ffcc00", "#00ccff"]);
23
24
// set the color scale as the color scale of the chart
25
chart.colorScale(customColorScale);
26
27
// add and configure a color range
28
chart.colorRange().enabled(true);
29
chart.colorRange().length("90%");
30
31
// set the chart title
32
chart.title("Tag Cloud Chart: Color Scale (Linear)");
33
34
// set the container id
35
chart.container("container");
36
37
// initiate drawing the chart
38
chart.draw();
39
});