Chart / dataset /web /AnyChart /bar /chart_0048_bar.html
Pekku's picture
Upload folder using huggingface_hub
79dc9c8 verified
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1" name="viewport">
<title>BCT Bar Chart 04</title>
<link href="https://playground.anychart.com/docs/samples/BCT_Bar_Chart_04/iframe" rel="canonical">
<meta content="Bar Chart,Bar Graph,Column Chart,Vertical Chart" name="keywords">
<meta content="AnyChart - JavaScript Charts designed to be embedded and integrated" name="description">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<link href="_deps/cdn.anychart.com/releases/8.14.1/css/anychart-ui.min_qe95e7e741b.css" rel="stylesheet" type="text/css">
<style>html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}</style>
</head>
<body>
<div id="container"></div>
<script src="_deps/cdn.anychart.com/releases/8.14.1/js/anychart-base.min_qe95e7e741b.js"></script>
<script src="_deps/cdn.anychart.com/releases/8.14.1/js/anychart-exports.min_qe95e7e741b.js"></script>
<script src="_deps/cdn.anychart.com/releases/8.14.1/js/anychart-ui.min_qe95e7e741b.js"></script>
<script type="text/javascript">anychart.onDocumentReady(function () {
// create a data set
var data = anychart.data.set([
["John", 10000, 12500],
["Jake", 12000, 15000],
["Peter", 13000, 16500, "#5cd65c", "#009933", null, {enabled: true}],
["James", 10000, 13000],
["Mary", 9000, 11000]
]);
// map the data
var seriesData_1 = data.mapAs({x: 0, value: 1, fill: 3, stroke: 5, label: 6});
var seriesData_2 = data.mapAs({x: 0, value: 2, fill: 4, stroke: 5, label: 6});
// create a chart
var chart = anychart.bar();
// create the first series, set the data and name
var series1 = chart.bar(seriesData_1);
series1.name("Sales in 2015");
// create the second series, set the data and name
var series2 = chart.bar(seriesData_2);
series2.name("Sales in 2016");
// set the chart title
chart.title("Bar Chart: Appearance (Individual Points)");
// set the titles of the axes
var xAxis = chart.xAxis();
xAxis.title("Manager");
var yAxis = chart.yAxis();
yAxis.title("Sales, $");
// set the container id
chart.container("container");
// initiate drawing the chart
chart.draw();
});</script>
</body>
</html>