- Chart Gallery
- Resource Charts
- Bus Schedule
Bus Schedule
{
"chart": {
"enabled": true,
"type": "resource",
"credits": {
"enabled": false
},
"selectRectangleMarqueeFill": {
"color": "#d3d3d3",
"opacity": 0.4
},
"data": [
{
"name": "BUS B1",
"type": "Metropolitan Transportation Authority",
"tags": [
"Fourth Avenue",
"87th Street",
"Fifth Avenue",
"86th Street",
"Avenue X",
"Ocean Parkway",
"Brighton Beach Avenue",
"Corbin Place",
"Oriental Boulevard"
],
"description": "\nFare: 2,75 $;\nBus stop: 49;\nRange of motion: 10 - 40 minutes;\nTechnical information: The length (distance) route forward 10.76 km;\n\nRoute Features: Some buses follow to \"86th Street/Stillwell Avenue\" or \"Brighton Beach Avenue/Ocean Parkway\" bus stop.\n",
"activities": [
{
"name": "Robert Obrien",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 540
}
],
"fill": "#62BEC1"
},
{
"name": "Carlos Walton",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 420
}
],
"fill": "#EA526F"
},
{
"name": "Carlos Walton",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 480
}
],
"fill": "#EA526F"
},
{
"name": "Robert Obrien",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 420
}
],
"fill": "#62BEC1"
},
{
"name": "Carlos Walton",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 600
}
],
"fill": "#EA526F"
},
{
"name": "Robert Obrien",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 600
}
],
"fill": "#62BEC1"
},
{
"name": "Levi Weaver",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 600
}
],
"fill": "#646881"
},
{
"name": "Reece Morrow",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 600
}
],
"fill": "#A5668B"
},
{
"name": "Reece Morrow",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 600
}
],
"fill": "#A5668B"
},
{
"name": "Levi Weaver",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 600
}
],
"fill": "#646881"
},
{
"name": "Carlos Walton",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 600
}
],
"fill": "#EA526F"
},
{
"name": "Robert Obrien",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 600
}
],
"fill": "#62BEC1"
},
{
"name": "Reece Morrow",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 600
}
],
"fill": "#A5668B"
},
{
"name": "Carlos Walton",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 510
}
],
"fill": "#EA526F"
}
]
},
{
"name": "BUS 2B (Suffolk)",
"type": "Suffolk County Transit",
"tags": [
"SUNY Farmingdale",
"Wheatley Heights",
"Wyandanch",
"Deer Park",
"North Babylon",
"Gardiner Manor Plaza",
"South Shore Mall ",
"Touro College",
"Bay Shore"
],
"description": "\nFare: 2.25 $;\nBus stop: 56;\nRange of motion: 60 minutes;\nTechnical information: The length (distance) route forward 28.64 km;\n\nRoute Features: Formerly owned by Inter-County Motor Coach, LIRR connections Wyandanch, Bay Shore.\n",
"activities": [
{
"name": "Ryan Powell",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 600
}
],
"fill": "#B26700"
},
{
"name": "Ryan Powell",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 390
}
],
"fill": "#B26700"
},
{
"name": "Armand Alford",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 480
}
]
},
{
"name": "Armand Alford",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 480
}
]
},
{
"name": "Jeremy Shepherd",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 480
}
],
"fill": "#F06543"
},
{
"name": "Jeremy Shepherd",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 570
}
],
"fill": "#F06543"
},
{
"name": "Armand Alford",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 390
}
]
},
{
"name": "Ryan Powell",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 600
}
],
"fill": "#B26700"
},
{
"name": "Armand Alford",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 390
}
]
},
{
"name": "Jeremy Shepherd",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 390
}
],
"fill": "#F06543"
},
{
"name": "Armand Alford",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 570
}
]
},
{
"name": "Jeremy Shepherd",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 600
}
],
"fill": "#F06543"
},
{
"name": "Ryan Powell",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 390
}
],
"fill": "#B26700"
}
]
},
{
"name": "BUS B100",
"type": "Metropolitan Transportation Authority",
"tags": [
"East 16th Street",
"Kings Highway",
"Ocean Avenue",
"Quentin Road",
"Gemtsen Avenue",
"Fillmore Avenue",
"Avenue T",
"Mill Avenue",
"Avenue U",
"East 66th Street",
"56th Drive",
"Strickland Avenue",
"National Drive"
],
"description": "\nFare: SingleRide 3.00 $, Metrocard 2.75 $;\nBus stop: 28;\nRange of motion: Weekdays 5 - 20 minutes, Saturday 20 - 30 minutes, Sunday 30 minutes, Late evening everyday: 30 or 60 minutes;\nTechnical information: The length (distance) route forward 6.9 km.\n",
"activities": [
{
"name": "Gary Vega",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 450
},
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 390
},
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 480
},
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 600
}
],
"fill": "#8789C0"
},
{
"name": "Elliott Vasquez",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 540
}
],
"fill": "#E06D06"
},
{
"name": "Elliott Vasquez",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 540
}
],
"fill": "#E06D06"
},
{
"name": "Elliott Vasquez",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 600
}
],
"fill": "#E06D06"
},
{
"name": "Blair Mcleod",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 450
},
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 450
},
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 450
}
]
},
{
"name": "Gary Vega",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 450
}
],
"fill": "#8789C0"
},
{
"name": "Blair Mcleod",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 600
}
]
},
{
"name": "Blair Mcleod",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 410
}
]
},
{
"name": "Elliott Vasquez",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 540
}
],
"fill": "#E06D06"
}
]
},
{
"name": "BUS 3A (Suffolk)",
"type": "Suffolk County Transit",
"tags": [
"South Shore Mall",
"Gardiner Manor Plaza",
"Brentwood Railroad",
"West Brentwood",
"Suffolk County Community",
"College, Brentwood",
"Hauppauge Industrial Park"
],
"description": "\nFare: 2.25 $;\nBus stop: 59;\nRange of motion: 50 - 80 minutes;\nRoute Features: LIRR connections\nBrentwood;\nTechnical information: The length (distance) route forward 31.37 km.\n",
"activities": [
{
"name": "Cyrus Mcclure",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 480
}
],
"fill": "#4C2C69"
},
{
"name": "Cyrus Mcclure",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 390
}
],
"fill": "#4C2C69"
},
{
"name": "Levi Weaver",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 600
}
],
"fill": "#646881"
},
{
"name": "Lee Alvarado",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 480
}
],
"fill": "#63595C"
},
{
"name": "Callum Newman",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 420
}
],
"fill": "#95A3B3"
},
{
"name": "Vincent Wheeler",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 360
}
],
"fill": "#4CB944"
},
{
"name": "Vincent Wheeler",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 600
}
],
"fill": "#4CB944"
},
{
"name": "Vincent Wheeler",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 600
}
],
"fill": "#4CB944"
},
{
"name": "Asher Rowland",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 480
},
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 480
},
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 480
},
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 480
}
],
"fill": "#246EB9"
},
{
"name": "Vincent Wheeler",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 390
}
],
"fill": "#4CB944"
},
{
"name": "Reece Morrow",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 420
}
],
"fill": "#A5668B"
}
]
},
{
"name": "BUS Bx17",
"type": "Metropolitan Transportation Authority",
"tags": [
"East Fordman Road",
"Crotona Avenue",
"Prospect Avenue",
"East 149 Street",
"Saint Ann`s Avenue",
"East 138 Street",
"East 135 Street"
],
"description": "\nFare: 2,75 $;\nBus stop: 35;\nRange of motion: Weekday 7 - 8 minutes,\nWeekend 10 - 15 minutes;\nTechnical information: The length (distance) route forward 8.44 km.\n",
"activities": [
{
"name": "Lee Alvarado",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 540
}
],
"fill": "#63595C"
},
{
"name": "Oren York",
"intervals": [
{
"start": "2016-10-01",
"end": "2016-10-01",
"minutesPerDay": 540
}
],
"fill": "#D7AF70"
},
{
"name": "Oren York",
"intervals": [
{
"start": "2016-10-02",
"end": "2016-10-02",
"minutesPerDay": 900
}
],
"fill": "#D7AF70"
},
{
"name": "Lee Alvarado",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 600
}
],
"fill": "#63595C"
},
{
"name": "Callum Newman",
"intervals": [
{
"start": "2016-10-03",
"end": "2016-10-03",
"minutesPerDay": 420
}
],
"fill": "#95A3B3"
},
{
"name": "Callum Newman",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 360
}
],
"fill": "#95A3B3"
},
{
"name": "Cyrus Mcclure",
"intervals": [
{
"start": "2016-10-04",
"end": "2016-10-04",
"minutesPerDay": 480
}
],
"fill": "#4C2C69"
},
{
"name": "Cyrus Mcclure",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 480
}
],
"fill": "#4C2C69"
},
{
"name": "Lee Alvarado",
"intervals": [
{
"start": "2016-10-05",
"end": "2016-10-05",
"minutesPerDay": 600
}
],
"fill": "#63595C"
},
{
"name": "Oren York",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 540
}
],
"fill": "#D7AF70"
},
{
"name": "Callum Newman",
"intervals": [
{
"start": "2016-10-06",
"end": "2016-10-06",
"minutesPerDay": 420
}
],
"fill": "#95A3B3"
},
{
"name": "Callum Newman",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 420
}
],
"fill": "#95A3B3"
},
{
"name": "Cyrus Mcclure",
"intervals": [
{
"start": "2016-10-07",
"end": "2016-10-07",
"minutesPerDay": 390
}
],
"fill": "#4C2C69"
}
]
}
],
"zoomLevels": [
{
"id": "days",
"unit": "day",
"count": 1,
"unitPixSize": 220,
"levels": [
{
"unit": "day",
"count": 1,
"formats": [
"MMM\ndd EEEE"
],
"hAlign": "left"
}
]
},
{
"id": "weeks",
"unit": "day",
"count": 1,
"unitPixSize": 100,
"levels": [
{
"unit": "day",
"count": 1,
"formats": [
"dd EEE",
"dd"
],
"hAlign": "left",
"fill": "#fff",
"fontColor": "#ABB6BC",
"height": 30
},
{
"unit": "week",
"count": 1,
"formats": [
"w MMM"
],
"fill": "#F0F5F8"
}
]
},
{
"id": "months",
"unit": "day",
"count": 1,
"unitPixSize": 25,
"levels": [
{
"unit": "day",
"count": 1,
"formats": [
"d EEE",
"d"
],
"hAlign": "center",
"padding": [
2,
5,
2,
5
],
"fill": "#fff",
"height": 30
},
{
"unit": "week",
"count": 1,
"formats": [
"w MMM"
],
"fill": "#F0F5F8"
}
]
}
],
"zoomLevel": "days",
"timeLine": {
"enabled": true,
"background": {
"zIndex": 0,
"enabled": false
},
"holidays": {
"padding": {}
}
},
"calendar": {
"timezoneOffset": 0,
"availabilities": []
},
"xScale": {
"type": "date-time-with-calendar",
"inverted": false,
"maximum": null,
"minimum": null,
"minimumGap": 0.01,
"maximumGap": 0.01,
"softMinimum": null,
"softMaximum": null,
"maxTicksCount": null,
"skipHolidays": false
},
"resourceList": {
"enabled": true,
"background": {
"zIndex": 0,
"enabled": true
},
"names": {
"fontColor": "#008CC3"
},
"types": {
"fontSize": "13",
"fontColor": "#606166",
"fontWeight": 700
},
"descriptions": {
"margin": {
"left": 5,
"top": 2,
"bottom": 3,
"right": 15
},
"fontColor": "#606166",
"fontWeight": 400
},
"tags": {
"fontSize": "12",
"fontColor": "#fff",
"background": {
"enabled": true,
"fill": "#E5007D",
"stroke": "none"
},
"position": "left-top",
"anchor": "left-top",
"rotation": "0"
},
"overlay": {
"enabled": true
}
},
"grid": {
"enabled": true,
"oddHolidayFill": {
"color": "#F4F4F4",
"opacity": 0.7
},
"evenHolidayFill": {
"color": "#F4F4F4",
"opacity": 0.7
},
"oddHolidayHatchFill": {
"type": "backward-diagonal",
"color": "green 0.25",
"thickness": 1.5,
"size": 15
},
"evenHolidayHatchFill": {
"type": "backward-diagonal",
"color": "green 0.25",
"thickness": 1.5,
"size": 15
}
},
"timeTrackingMode": "availability-per-chart",
"cellPadding": {
"left": 2,
"top": 2,
"bottom": 2,
"right": 2
},
"conflicts": {
"enabled": true
},
"pixPerHour": 20,
"currentStartDate": 1475280000000
}
}
<html>
<head>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-base.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-ui.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-exports.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-resource.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/js/anychart-data-adapter.min.js"></script>
<script src="https://cdn.anychart.com/releases/v8/themes/light_earth.min.js"></script>
<link href="https://cdn.anychart.com/releases/v8/css/anychart-ui.min.css" type="text/css" rel="stylesheet">
<link href="https://cdn.anychart.com/releases/v8/fonts/css/anychart-font.min.css" type="text/css" rel="stylesheet">
<style type="text/css">
html,
body,
#container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="container"></div>
<script>
anychart.onDocumentReady(function () {
// set chart theme
anychart.theme('lightEarth');
// The data used in this sample can be obtained from the CDN
// https://cdn.anychart.com/samples/resource-charts/bus-schedule/data.json
anychart.data.loadJsonFile(
'https://cdn.anychart.com/samples/resource-charts/bus-schedule/data.json',
function (data) {
var chart = anychart.resource();
chart.data(data);
chart
.timeTrackingMode('availability-per-chart')
.currentStartDate('2016-10-01')
.pixPerHour(20);
var activities = chart.activities();
activities.stroke('#fff');
activities.labels().padding(10);
chart
.grid()
.oddHolidayHatchFill('backward-diagonal', 'green 0.25', 1.5, 15)
.evenHolidayHatchFill('backward-diagonal', 'green 0.25', 1.5, 15);
var resourceList = chart.resourceList();
resourceList
.names({
fontColor: '#008CC3'
})
.types({
fontColor: '#606166',
fontSize: 13,
fontWeight: 700
})
.descriptions({
fontColor: '#606166',
fontWeight: 400
});
resourceList.descriptions().margin().right(15);
// Set tags settings.
resourceList
.tags()
.background('#E5007D')
.fontColor('#fff')
.fontSize(12);
// set container id for the chart
chart.container('container');
// initiate chart drawing
chart.draw();
}
);
});
</script>
</body>
</html>
Resource Charts are great for planning resources and time. They look like tables with a header displaying the dates or time periods and the first column is usually used for displaying the resource list.