Second scale causes problems on refresh.

Scheduler Javascript
#1

I seem to have a problem with the header height of my timeline view. Whenever i revisit my page that contains my scheduler it doubles the size of my timeline header.

I create the following timelineview during the initialization of my widget.

scheduler.createTimelineView({
		name:	"timeline",
		x_unit:	"minute",
		x_date:	"%i",
		x_step:	30,
		x_size: 48,
		x_start: 0,
		x_length: 48,
		y_unit:	scheduler.serverList("sections", []),
		y_property:	"section_id",
		render:"bar",
			second_scale:{
				x_unit: "hour", // unit which should be used for second scale
				x_date: "%H" // date format which should be used for second scale, "July 01"
			}
	});

I found out that if i remove the second scale completely this issue does not occur. So is this a bug or am i doing something wrong?

#2

Hello,

Can you please provide link to your page with the steps to reproduce this issue?

Kind regards,
Ilya

#3

You can log on capemob-accp.mendixcloud.com/ with ‘test’ ‘test’

Then try to go from the home screen to either the resource or task screen and then move back to the home form again.

#4

Hello,

widgets/widgets.js
You don’t want to init scheduler several times. Same with timeline view. Simply commenting our createTimelineView fixes height issue. Calling scheduler.init several times should also introduce some issues.

Kind regards,
Ilya

#5

Thanks i thought it was something like that.

But how would i prevent that? Or is there a way to unintialize the scheduler and destroy the view when i leave the screen? The scheduler is wrapped in a dojo widget so if there would be a function to destroy the scheduler, i could simply call that on the uninitialization of the dojo widget.

#6

I have looked into unintializing the scheduler, but have not found anything so far. So I tried setting the height back manually but found that there are too much relativly positions to use this correctly.

What i did not to solve this was add a boolean to the scheduler to see if i ever initialized it before. If i did i skip the createtimeline view and just initialize the scheduler again. This works like a charm. However i think it would be better if i was ableto remove/delete/unintialize the timelineView. Is there a way to to this?

#7

Hello,

There is no way to delete/destroy scheduler or timeline view.

But if you are not removing previous scheduler container from the DOM - why would you want to init it again in the first place?

Kind regards,
Ilya

#8

We have exactly the same problem. In that way, we are not able to use “second_scale”, we also dont want to reinitialize the hole scheduler due to lags of performance. We are currently using the latest release of dhtmlxScheduler Pro.

Is there any solution for this?

#9

Hello,

You need to change the configuration objects of all timelines specified on the page by using ‘scheduler.matrix’ config object.
docs.dhtmlx.com/scheduler/api__s … other.html

Please, see example how to dynamically change the configurations of a timeline:
docs.dhtmlx.com/scheduler/snippet/3bfd5113

#10

Im facing this issue right now. How do fix it? I have tried everyway here but still giving random double height issue.

#11

Hello @Ian_Pee ,

As each createTimelineView call doubles the previous scale_height value(if the second_scale is enabled, you should reset it before each method call, like follows:

function recreateTimeline(){
  // This  line fixes the scale height on each timeline create
  scheduler.xy.scale_height = 20; 
  scheduler.createTimelineView({
    name:    "timeline",
    x_unit:    "hour",
    x_date:    "%H:%i",
    x_step:    4,
    x_size: 48,
    x_start: 2,
    x_length: 48,
    y_unit:    sections,
    y_property:    "section_id",
    render:"bar",
    second_scale:{
      x_unit: "day", 
      x_date: "%F %d" 
    }
  });
}

Here is a demo(Click the Reset button):
https://snippet.dhtmlx.com/5/83e16ee83

If the issue still exists, could you please reproduce it in the demo above(open the snippet => reproduce the issue on HTML/CODE tabs => click the “Share” button => post here a new link).

btw, please do not duplicate question in different topics.

Kind regards,

#12

Hi Siarhei,

Thanks for getting back to me.
I have tried your approach but it seems that there are still errors when switching between multiple timeline views.

I have edited the snippet to reproduce the error.
http://snippet.dhtmlx.com/5/c2b0b355a
Click on “Reset” and then “Reset2” then the second scale will disappear.

What I want to achieve is to switch between 2-3 timelines with different configurations and different second_scale with a press of a button.

Thanks alot.

#13

bump because urgent matter

#14

Hello @Ian_Pee ,

Thank you for the provided demo.
Just a little clarification, of the current scenario - the issue in your demo occurs because the scheduler creates the second_scale just by doubling the scale_height - so if the main scale is 20px it doubles its value to 40px to display the second scale.

In your demo, you create the timeline view timeline on render 1 click. In the render 2 click, you are creating the different view (timeline_2) but resetting the scale_height for all the scheduler(so it affects the currently displayed view (timeline1), so it causes the current issue.

So the thing that you can do, is to:

1.) Use the view with same name but different configs for each view move:
http://snippet.dhtmlx.com/5/b17c2e1be

2.) Use the default scheduler navigation to switch views like follows:

    <div class="dhx_cal_tab" name="timeline_tab" style="right:280px;"></div>
    <div class="dhx_cal_tab" name="timeline2_tab" style="right:280px;"></div>
  </div>

Demo (HTML/CODE tabs):
http://snippet.dhtmlx.com/5/001b50abe

3.) Create timelines at scheduler initializing, and just switching with them by custom functions:

function recreateTimeline(){
  // This  line fixes the scale height on each timeline create
  scheduler.setCurrentView(new Date(2020, 5, 29),"timeline")
}


function recreateTimeline2(){
  // This  line fixes the scale height on each timeline create
  scheduler.setCurrentView(new Date(2020, 5, 29),"timeline2")
}

(if you are using some framework that destroys scheduler on switching tab, you also should set the scale_height before the scheduler.init call).

Currently, the dev team works on a fix for this issue, unfortunately there is no ETA.

1 Like