Premium support for our pure JavaScript UI components


Post by mats »

Ok you can of course wrap chart in a div, main point remains - using renderer should be the right path. Happy to jump on a quick call on Monday if it’s still possible to get it working.


Post by tpoe »

Hello mats,

is the idea to create the div-element, inject the chart, then append it to cellElement? I think i will give that a try!


Post by mats »

Yes something like that. We’ll make a demo soon similar to yours to show it off!


Post by tpoe »

Hello mats,

#1 is solved! The approach to directly append the div-element to cellElement worked like a charm. Thank you!

#2 still persists. I added a more descriptive screenshot. And here is a piece of our config, to show what we are doing:

"resourceTimeRanges": [
	{
		"resourceId": 1
		, "startDate": "2020-11-02T00:00:00.000Z"
		, "endDate": "2020-11-06T23:59:59.000Z"
		, "cls": "timeaxis--workingtime"
	}
	, {
		"resourceId": 2
		, "startDate": "2020-11-02T00:00:00.000Z"
		, "endDate": "2020-11-06T23:59:59.000Z"
		, "cls": "timeaxis--workingtime"
	}
	, {
		"resourceId": 3
		, "startDate": "2020-11-02T00:00:00.000Z"
		, "endDate": "2020-11-06T23:59:59.000Z"
		, "cls": "timeaxis--workingtime"
	}
]

Somehow those elements still keep their old height and are not recalculated. I tried to set them height: 100% in CSS, but then they have the height of the whole scheduler. Is there a way to also manipulate the height of those elements with the class .b-sch-resourcetimerange? Another renderer maybe? (BTW: The charts are transparent, so the grey is not the background-color of the charts, but the background-color of the scheduler row.)

Attachments
2021-06-18 09_42_25-Pattern Lab - organisms-bryntum.png
2021-06-18 09_42_25-Pattern Lab - organisms-bryntum.png (157.93 KiB) Viewed 493 times

Post by mats »

Any way you could upload something runnable or code so we can see what your renderer does?


Post by tpoe »

Hello mats,

i will prepare something. But it will take a moment. :smile:


Post by tpoe »

Hello mats,

i am having problems to prepare a dedicated example. There is no CDN-version of the Bryntum scheduler available so i cannot use JSFiddle or something similar. How do you usually prepare a Bryntum-example? Or do you have a kind of boilerplate, which i could just customize?


Post by tpoe »

Hello mats,

forget about #2. Even if the height of the ResourecTimeRanges could be manipulated (I did it manually in the browser inspector), the element stacking does not make it possible to put those elements behind the chart due to the nesting of DOM-elements. So we have to stick to a white background. Thanks for your great help. I really appreciated it. In the next days i will prepare pieces of code, so you could possibly make an example for your example page out of it.


Post by mats »

We made some progress already actually, should end up in 5.0 :) Would be nice to compare to what you have so far.

Attachments
Screenshot 2021-06-22 at 01.01.49.png
Screenshot 2021-06-22 at 01.01.49.png (316.3 KiB) Viewed 475 times

Post Reply