diff --git a/README.md b/README.md index 422e695..954e770 100644 --- a/README.md +++ b/README.md @@ -1,31 +1,38 @@ # vue-ganttastic + A simple and easy-to-use Gantt chart component for Vue.js ## Homepage + [Homepage of the project](https://infectoone.github.io/vue-ganttastic-homepage/#/docs) ## Installation + You can install and use Vue-Ganttastic in your project using npm: + ``` npm install vue-ganttastic ``` [Moment.js](https://momentjs.com/) is a peer-dependency of Vue-Ganttastic. In order for Vue-Ganttastic to work correctly, you need to install it in your project: + ``` npm install moment ``` ## Basic Usage + Import the components GGanttChart and GGanttRow. Use g-gantt-chart in your template, pass the desired chart start and chart end time as props (chart-start and chart-end) and add g-gantt-rows to the default template slot. -Pass an array containing your bar objects to every row using the bars prop, while specifying the name of the properties in your bar objects that stand for the bar start and bar end time using the props bar-start and bar-end +Pass an array containing your bar objects to every row using the bars prop, while specifying the name of the properties in your bar objects that stand for the bar start and bar end time using the props bar-start and bar-end For more detailed information, such as how to style the bars or additional configuration options, please refer to the [docs](https://infectoone.github.io/vue-ganttastic-homepage/#/docs) on the project's homepage (coming soon). The following code showcases a simple usage example in a .vue SFC (Single File Component) + ```html