Hello everyone. I bought a license (Gannt) and deployed the local version 4.1.0, but I cannot display the resource diagram (the ResourceHistogram component does not work or does not exist). Where can I get it, connect it? or is it in a Scheduler component that needs to be purchased separately?
Support Forum
Did you look at the resourcehistogram demo in your /examples folder? It shows how to use it. https://bryntum.com/examples/gantt/resourcehistogram/
(the ResourceHistogram component does not work or does not exist)
Please describe in more details how you tried to implement it
Hi, we have React App written in TypeScript and try to implement TimeLine and Resource Grid on the Gantt page. In the gantt package examples, we have links to lib (written in vanilla JS). How we can add TimeLine and Grid Resource feature in React app? It looks like we need to add additional npm packages, but didn't find how to do it, or we need to copy "lib" folder to our project?
You shouldn't need any other packages. <ResourceHistogram> and <TimeLine> are wrappers listed in the React Integration Guide. The React example that uses Gantt + Resource histogram is here:
https://bryntum.com/examples/gantt/frameworks/react/javascript/resource-histogram/build/index.html and React Timeline example is here:
https://bryntum.com/examples/gantt/frameworks/react/javascript/timeline/build/index.html
Source of these examples should give you a good starting point.
Hi, We have a problem with React App (TypeScript) we try to implement BryntumResourceHistogram and have the following problem: Not loading resource payload. We try to use JSON from the example provided in version 4.2.2 and do not have success also.
- Attachments
-
- Снимок экрана 2021-07-30 в 10.06.07.png (51.98 KiB) Viewed 771 times
-
- Снимок экрана 2021-07-30 в 10.04.35.png (765.56 KiB) Viewed 771 times
-
- Снимок экрана 2021-07-30 в 10.04.16.png (394.02 KiB) Viewed 771 times
Although it does not explain the problem, I have one comment:
In the code you posted you have projectConfigLocal
function that returns a config option of the project. There's nothing wrong with it if you use it only in the histogram exactly as above. However, if you'd like to use the same project for the histogram and a Gantt then it wouldn't work because the config object is internally used to create an instance of ProjectModel.
Other than that, there is no obvious problem. Post please a showcase that we can run, investigate and debug to sort it out.
The problem is the following: I have a resource and have the task assigned to the resource but histograms show zero events and no green square for these resources with payload. There is no problem with connecting to Gantt this is working ok (this example is just for test JSON from examples provided with framework). You can see JSON in the Network panel on the screen above. Resouce with id 1 has assignments but nothing shows on Histogram, only the name of the resource.
Please find example project in attachment
- Attachments
-
- test-histogramm.zip
- (3.63 MiB) Downloaded 84 times
The problem is that project
is passed to the histogram as object. Histogram is a defined at SchedulerPro level so it does not understand tasks
property in json
.
You have 2 options:
- change
tasks
toevents
inlaunch-saas.json
- create Gantt project and pass it to the histogram
The 2nd option would look like this:
import * as React from 'react'
import { useRef } from 'react'
import { BryntumResourceHistogram } from '@bryntum/gantt-react'
import { ProjectModel } from '@bryntum/gantt/gantt.umd.js'
export default function GanttResources() {
const project = new ProjectModel({
startDate: '2019-01-16',
endDate: '2019-02-13',
transport: {
load: {
url: '/data/launch-saas.json',
},
},
autoLoad: true,
autoSync: false,
})
const histogramConfig = {
viewPreset: 'weekAndDayLetter',
hideHeaders: false,
rowHeight: 50,
showBarTip: true,
scheduleTooltipFeature: true,
columns: [{ type: 'resourceInfo', field: 'name', showEventCount: true, width: 410 }],
height: 400,
columnLines: true,
project: project,
startDate: '2019-01-16',
}
// this works
return <BryntumResourceHistogram {...histogramConfig} />
}
Note: Mind the startDate too.