topTier and bottomTier date format changed when zoomIn or zoomOut

Question

Hi!
Is there a way to change the topTier format and bottomTier format for all the units? (Week, Month, Year)
I have my default timeLineSettings like this but when I make a zoomIn or zoomOut the format change.

Also, Is there a way to change the language to Spanish?
Thanks!!

  const [timeLineSettings] = useState({
    timelineUnitSize: 40,
    topTier: {
      format: 'MMM',
      unit: 'Month',
    },
    bottomTier: {
      format: 'dddd',
      unit: 'Day',
    },
  });

Premkumar Sudalaimuthu · Answer

Hi Brandon, 
 




Query  

Solution  


Is there a way to change the topTier format and bottomTier format for all the units? (Week, Month, Year)I have my default timeLineSettings like this but when I make a zoomIn or zoomOut the format change.  

We can achieve your requirement by customizing the zooming levels. In Gantt, the zoom in and zoom out actions are performed based on the predefined zooming levels in the zoomingLevels property. You can customize the zooming actions by defining the required zooming collection to the zoomingLevels property. In the customized levels, you can also able to change the format for top and bottom tier units. We have shared our online documentation for how to customize the zooming levels. Please refer to the online documentation for more information. 
 
Online documentation: https://ej2.syncfusion.com/react/documentation/gantt/time-line/#customizing-zooming-levels  


Also, Is there a way to change the language to Spanish?  

Yes, we can able to change the language according to our requirement using localization. We have shared an example sample for how to use the localization and also online documentation for localization. Please refer to the sample and online documentation for more information. 
 
Sample: https://stackblitz.com/edit/localization-ptckpw-jwfaqu-cxrjer?file=index.js  
 
Online documentation: https://ej2.syncfusion.com/react/documentation/gantt/global-local/  
 
Please contact us for more assistance. 
 
Regards, 
Premkumar S

Query	Solution
Is there a way to change the topTier format and bottomTier format for all the units? (Week, Month, Year) I have my default timeLineSettings like this but when I make a zoomIn or zoomOut the format change.	We can achieve your requirement by customizing the zooming levels. In Gantt, the zoom in and zoom out actions are performed based on the predefined zooming levels in the zoomingLevels property. You can customize the zooming actions by defining the required zooming collection to the zoomingLevels property. In the customized levels, you can also able to change the format for top and bottom tier units. We have shared our online documentation for how to customize the zooming levels. Please refer to the online documentation for more information. Online documentation: https://ej2.syncfusion.com/react/documentation/gantt/time-line/#customizing-zooming-levels
Also, Is there a way to change the language to Spanish?	Yes, we can able to change the language according to our requirement using localization. We have shared an example sample for how to use the localization and also online documentation for localization. Please refer to the sample and online documentation for more information. Sample: https://stackblitz.com/edit/localization-ptckpw-jwfaqu-cxrjer?file=index.js Online documentation: https://ej2.syncfusion.com/react/documentation/gantt/global-local/