🌈 Lightweight jQuery gantt plugin.
Switch branches/tags
Nothing to show
Clone or download
Latest commit 15c4037 Mar 29, 2018
Permalink
Failed to load latest commit information.
dist reset stacking context from there Aug 15, 2017
examples Initial commit Apr 24, 2017
l10n Initial commit Apr 24, 2017
src Add import jquery Feb 27, 2018
test Initial commit Apr 24, 2017
.editorconfig Initial commit Apr 24, 2017
.eslintrc.yml Initial commit Apr 24, 2017
.gitattributes Initial commit Apr 24, 2017
.gitignore Initial commit Apr 24, 2017
README.md Changed package name Sep 15, 2017
package.json Changed package name Sep 15, 2017
rollup.config.js Initial commit Apr 24, 2017

README.md

jquery-gantt

License: MIT

A jquery plugin for creating a gantt chart.

Features

  • Localizationable
  • Easy configuration
  • Lightweight (5KB gzipped)
  • Works in all major browsers including IE11+

Compatibility

IE11+, Edge, Chrome, Firefox, Opera, Safari

Installation

NPM

npm install jquery.gantt

Github

git clone http://github.com/oguzhanoya/jquery-gantt.git

Configuration

Setting Default Value Description
data [] Data source
dataURL '' Data source url
startDate new Date() Chart start date
endDate new Date() Chart end date
cellWidth 20 Width of the chart cell
cellHeight 38 Height of the chart cell
stickyHeader false Stick an header
mouseScroll false Enables slide moving with mouse
mouseScrollpx 120 Mouse scroll speed
lazyLoad false Lazy load technique
autoHide false Auto hiding of out of date events

Localization

The default l10n configuration format looks like this:

$.fn.gantt.l10n['en'] = {
    monthNames: [ "January","February","March","April","May","June","July","August","September","October","November","December" ],
    monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun","Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ],
    dayNames: [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ],
    dayNamesShort: [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ],
    dayNamesMin: [ "Su","Mo","Tu","We","Th","Fr","Sa" ]
};

You must provide 12 months and 7 weekdays (with abbreviations). Always specify weekdays in this order with Sunday first.

Source Configuration

[{
    "title": "Example",
    "startdate": "2016-06-10",
    "enddate": "2016-06-12",
    "url": "http://www.example.com/",
    "type": "Cruise",
    "minNight": "2",
    "price": {
        "original": {
            "price": 798,
            "priceType": "€"
        },
        "converted": {
            "price": 878,
            "priceType": "$"
        }
    },
    "tooltipData": {
        "title": "Example Tour",
        "image": "http://example.com/image.jpg",
        "desc": [
            "Lorem ipsum dolor sit amet",
            "consectetur adipisicing elit",
            "Explicabo repellat temporibus "
        ],
        "dates": {
            "begin": "10 June 2016 Friday",
            "end": "12 June 2016 Sunday"
        }
    }
}]

License

MIT