What's New in Essential JS 2: 2023 Volume 4
Detailed Blog page Skeleton loader
What's New in Essential JS 2 2023 Volume 4

In our Essential Studio 2023 Volume 4 release, we’ve rolled out many new features and components for our Essential JS 2 platforms. Our commitment to providing cutting-edge tools remains unwavering, and we believe these updates will empower you to create even more robust and visually appealing web applications.

Let’s look at the key additions!

New controls: Stepper and 3D Chart

We’ve introduced the following new components in this 2023 Volume 4 release:

Stepper (preview)

The new Stepper component facilitates navigation through step-based processes in web apps. You can customize the step types, orientation, linear flow, label positioning, tooltips, and templates for a seamless user experience.

Essential JS 2 Stepper control
Essential JS 2 Stepper control

Note: For more details, refer to the Stepper component demo.

3D Chart (preview)

The new 3D Chart control offers a visually engaging representation of data in three dimensions.

Its key features include:

  • Six chart types: column, bar, stacked column, stacked bar, 100% stacked column, and 100% stacked bar.
  • Data binding with JSON objects or a data manager.
  • Data labels, axis types, legends, and user interaction options.
  • Export capabilities in JPEG and PNG formats.
  • Right-to-left (RTL) rendering mode.
Essential JS 2 3D Chart
Essential JS 2 3D Chart

What’s new in our existing components?

Let’s look at the new features added to our existing Essential JS 2 components!

Dropdowns

The dropdown components, namely the AutoComplete, ComboBox, and Dropdown List, now support virtual scrolling in combination with grouped data, allowing efficient navigation through large lists without loading all items at once.

Virtual scrolling with grouping in the AutoComplete component
Virtual scrolling with grouping in the AutoComplete component

Note: For more details, refer to the virtualization with grouping in AutoComplete demo.

Bullet Chart

Users can now apply different colors to value and target bars in the Bullet Chart control, thus enhancing the visual representation of data.

Customizing value bar colors in Bullet Chart
Customizing value bar colors in Bullet Chart

Charts

The Charts control has the following enhancements:

  • Step position: Step positions for lines allow users to apply steps from the left, center, and right sides of each data point in a step series.
    Custom step positions in Charts
    Custom step positions in Charts
  • Axis title alignment: Align the axis title to the left, right, and center of the chart area.
    Axis title alignment customization in Charts
    Axis title alignment customization in Charts
  • Fixed tooltip: Position the tooltip at a fixed location within a chart for enhanced data presentation.
    Fixed tooltip feature in Charts
    Fixed tooltip feature in Charts

Circular Gauge

Circular Gauge’s axis line, range, pointer, and annotation elements can be animated one by one to create a smooth appearance when rendered initially.

Animation feature in Circular Gauge
Animation feature in Circular Gauge

Diagram

Users can now add UML class shapes to the symbol palette in the Diagram component. 

Note: For more details, refer to the UML class diagram demo.

Word Processor

The Word Processor comes with the following enhancements:

  • Ruler: A ruler for both horizontal and vertical orientations provides enhanced layout and formatting control for documents.
    Ruler in Word Processor
    Ruler in Word Processor
  • Tab stop: Tab stops offer precise text alignment at specific points regardless of the content length for a clean and organized document layout. Set multiple tab stops with different alignments and positions for complex layouts.
    Tab stops feature in Word Processor
    Tab stops feature in Word Processor
  • Collaborative editing (preview): Multiple users can collaborate on the same document in real-time, improving efficiency and teamwork.

Gantt Chart

The new features added to the Gantt Chart are:

  • Timeline virtualization: Load project tasks with longer timelines efficiently, rendering only the visible timeline cells.
    Timeline virtualization in Gantt Chart
    Timeline virtualization in Gantt Chart
  • Drag and drop taskbars: Reorder tasks by dragging and dropping taskbars within Gantt Chart rows.
    Dragging and dropping taskbars between tasks in Gantt Chart
    Dragging and dropping taskbars between tasks in the Gantt Chart
  • Validation rules in editing: Column validation ensures data validity, displaying error messages for invalid fields before saving.
    Validation rules feature in Gantt Chart
    Validation rules feature in the Gantt Chart
  • Enhancements in PDF exporting: The following compatibility features were added for PDF exporting, enhancing comprehensive reporting, customization options, and data integrity:
    • Unscheduled tasks.
    • Manually scheduled tasks.
    • Split tasks.
    • Event markers, holidays, and indicators.
    • Custom fonts in exportedPDF
    • Exported Gantt Chart template columns.
    • Custom data source for PDF exporting.
    • Custom header and footer.

DataGrid

The DataGrid control has the following enhancements:

  • Load checkbox list data on demand: For improved performance with large datasets.
    Loading checkbox data on demand in DataGrid
    Loading checkbox data on demand in DataGrid
  • Adaptive view layout: Menus, pop-ups, and page-size dropdown elements now adjust layouts based on mobile device screen sizes.
  • Exporting the grid: You can now save grid data as a blob, memory stream, or file stream during export.
  • Template customization for empty records: Customize the content displayed when there are no records to show in the grid. Users can add their own content or incorporate HTML elements using the template option. This empty record content is presented when binding empty data to the grid or when an action within the grid results in no records to display.
    Template customization for empty records in DataGrid
    Template customization for empty records in DataGrid

Image Editor

Straightening

The Image Editor now lets users align and correct the orientation of images, refining their overall presentation. This feature ensures a polished and visually appealing output, enhancing the quality and impact of the final composition.

Straightening feature in Image Editor
Straightening feature in Image Editor

Note: For more details, refer to the Image Editor demo.

ListView

On-demand data loading or lazy loading

The ListView supports on-demand data loading or lazy loading by retrieving data for just the current viewport.

Note: For more details, refer to the lazy loading in ListView demo.

Maps

Polygon shape rendering

Draw and display polygon shapes over the main layer of the Maps control.

Polygon shape rendering in Maps
Polygon shape rendering in Maps

Note: For more details, refer to the Maps demo.

PDF Viewer

We have delivered the following new, user-friendly features for the PDF Viewer control:

  • Keyboard accessibility: Navigate through the PDF Viewer using keyboard shortcuts for an enhanced user experience.
  • Default toolbar customization: Customize the primary toolbar layout, arrangement, and visibility.

Note: For more details, refer to the PDF Viewer demo.

Scheduler

The Scheduler control supports the following new features in this 2023 Volume 4 release:

  • Toolbar customization: Customize the icons, text, and tooltips of the Scheduler toolbar items for a personalized experience.
    Customizing the toolbar in Scheduler
    Customizing the toolbar in Scheduler
  • Maximum events per row: You can set the maximum number of concurrent events to be displayed in the Scheduler for improved visualization.

Spreadsheet

The Spreadsheet control receives the following enhancements:

  • Display confirmation dialogs before opening Excel files with external workbook references.
  • New formulas, including LOOKUP, VLOOKUP, HLOOKUP, SQRT, RSQ, ROUNDDOWN, EOMONTH, and NOT, have been added.

TreeGrid

Aggregate in exporting

You can now export TreeGrid to PDF and Excel files with aggregate cell values included in the footer.

Note: For more details, refer to the TreeGrid demo.

Conclusion

Thanks for reading! This new update brings a multitude of features for our controls, ensuring that Essential JS 2 remains at the forefront of web development tools. Explore these new capabilities and let us know how they enhance your development process!

You can check out all the other updates in this release on our Release Notes and What’s New pages.

For questions, you can reach us through our support forumssupport portal, or feedback portal. We are always happy to assist you!

Related blogs

Be the first to get updates

Sumankumar G

Meet the Author

Sumankumar G

SumanKumar is a Technical Product Manager at Syncfusion for Web products. He is passionate about Web technology and has been active in development since 2010.