Wijmo Build 5.20201.680 - May 28, 2020

This minor release of Wijmo has some major features! This build includes a new wijmo.cloud module for easily connecting to Google Sheets, Firestore, and OAuth services.

It also includes a new touch module and a new WebGL rendering engine for charts with millions of data points.

Wijmo Cloud

We are introducing wijmo.cloud as a new module for more easily integrating cloud services into wijmo. The first integrations in this module are for connecting to Google services:

  • The GoogleSheet class makes it easy to show and edit data from Google Sheets in your Wijmo applications.
    Google Sheets are easy to set up and use, and they perform well with relatively small datasets. Of course, they are not real databases. You should not use them to store large tables (say with a hundred thousand items), and you should not store mission-critical data in them. But they can be super useful in many situations, and many people have lots of data stored in Google sheets.

  • The Firestore and Snapshot classes make it easy to show and edit data from Firestore databases in your Wijmo applications.
    Firestore is Google's new flexible, scalable NoSQL cloud database. They are designed to store and sync data for the client- and server-side development. Unlike Google Spreadsheets, Firestore is a real database. You can use it to store vast amounts of data, and it is much easier to set up and use than traditional SQL products.

  • The OAuth2 class makes it easy to integrate authentication with these Google services too.

WebGL Chart for Handling Millions of Points

We have had some customers that needed to render millions of points on a scatter chart. We have a lot of performance tuning in our SVG chart to render a lot of data with speed, but we can only do so much when working with many DOM elements. So for this scenario, we are introducing a WebGL chart renderer for FlexChart. This renderer is in a new wijmo.chart.webgl module. If you are working with charts with millions of data points, you should consider trying it!

Note, that WebGL rendering has certain limitations for now (like being unable to style chart elements with CSS). So it should only be used when needed.

Wijmo Touch

We are introducing a new wijmo.touch module with a polyfill that makes drag-drop work on touch devices the same way it does on desktop machines.

Improved Input Labels

We have improved labeled-control CSS class to make it easier to layout form labels in inputs in any app.

Change Log

  • [Cloud] New wijmo.cloud module for easy integration with some cloud services from google
  • [Cloud] Added Firestore class to wijmo.cloud module for connecting to Firestore databases using REST API
  • [Cloud] Added Snapshat class to wijmo.cloud module for connecting to realtime Firestore database using official client library
  • [Cloud] Added GoogleSheet class to wijmo.cloud module that makes it easy to show and edit data from Google Sheets.
  • [Cloud] Added an OAuth2 class to wijmo.cloud module so that you can easily integrate authentication with Google services too
  • [Touch] Added new wijmo.touch module with a polyfill that makes drag-drop work on touch devices the same way it does on desktop machines.
  • [FlexChart] New module wijmo.chart.webgl with high performance WebGLRenderEngine. Set new FlexChart.renderEngine property to use it: flexChart.renderEngine = new WebGLRenderEngine();

The following sample is added to demonstrate the feature: Chart\Performance\WebGL\Scatter

  • [input] improved wj-labeled-control CSS class to make it easier to layout form labels in inputs in any app
  • [FlexSheet] Request to add the EXACT formula in FlexSheet.
  • [ReportViewer/PdfViewer] Added the zoomModeChanged event.
  • [MultiRow] Added an isRowHeader property to the column groups. This makes it possible to show bound and unbound cells with custom layouts in row headers.
  • [MultiRow] Improved support for rowspan property in cell groups.
  • [Styles] Updated Material sub-themes to use scss (used to be less). Now all themes are stand-alone CSS files, they don't require other theme files (or wijmo.css).
  • [Popup, Tooltip] Added a PopupPosition parameter that allows the caller to specify the preferred position of the popup/tooltip with respect to the reference element.
  • [Popup] Added dragging, dragged, resizing, resized events to the Popup control.
  • [GroupPanel] Added a globalized version of the default placeholder content. If you did not set this property and want to keep the control empty, please set the "placeholder" property to an empty string setting it to null will show the default/localized message).
  • [Globalize] The formatNumber function now treats format specifiers "F" and "G" like "f" and "g" (fixed point and general), but with thousand separators.
  • The onSaved callback of the FlexGridXlsxConverter.saveAsync method now called with an empty 'base64' argument when the fileName parameter is empty.
  • [wijmo.grid.pdf] Added PdfFormatItemEventArgs.drawBackground method.
  • [Vue] Added v-wjTooltip attribute directive, which allows you to define a tooltip for any element in the Vue template. The following sample is updated to demonstrate the use of the directive: Input/Menu/ContextMenus
  • [Vue] v-wj-context-menu attribute directive can be defined using the v-wjContextMenu camel-case name now.
  • [React/Redux/ImmutabilityProvider] Added support for column bindings to nested properties, like 'persons[1].surname'.

  • [React/Redux/ImmutabilityProvider] Added cloningItem event, which allows you to use custom logic for cloning items before mutating in complex data scenarios.

Wijmo Build 5.20201.664 - April 7, 2020

We found a critical issue in build 5.20201.663 where FlexGrid was flickering when scrolled on iOS 13. We have fixed this issue as of build 5.20201.664. Please update to use the latest version of wijmo to ensure your applications run smoothly on iOS 13.

Build 5.20201.664 is available on NPM, CDN and to download from our website.

If you aren't able to quickly upgrade, you can alternatively add this CSS patch to your application:

.wj-flexgrid [wj-part=root] {
              -webkit-overflow-scrolling: touch;
            }
            

Wijmo 2020 v1 - March 31, 2020

We are pleased to announce the release of Wijmo 2020 v1. Designed to be small, flexible, and efficient, this release carefully balances new features with control size and complexity. We have new security updates, many FlexGrid and FlexChart enhancements, in addition to a new editable React Redux DataGrid feature. As always, we modularize our components and features, so your app only loads what it needs. We optimize rendering (often with virtualization), so our components are efficient no matter how large your dataset.

Build a Stock Portfolio App with OpenFin and Wijmo's JavaScript Components

Wijmo Stock Portfolio is a financial sample that demonstrates the usage of Wijmo Components in an OpenFin application. This application consists of several windows. OpenFin’s new Platform API allows users to arrange these windows in the desired workspace.

The stock portfolio app consists of several windows. Each window is implemented using different web frameworks (like React, Angular, and Web Components). OpenFin’s new Platform API allows users to arrange and customize windows into the desired workspace.

See the app in action! This video demonstrates how the app works while arranging windows like a dashboard:

Strengthening Security

The latest version of Wijmo is fully CSP-compliant. It does not require you to add “unsafe-inline” or “unsafe-eval” to your CSP, nor does it require “nonces” or hashes. Our components can work seamlessly in your strictly secured JavaScript application without any compromises to your policy.

What’s New in React

Editable React Redux DataGrid

FlexGrid is offering the first enterprise solution for editable datagrids in React Redux applications!

FlexGrid updates the underlying data array typically with the changes made by a user via the grid. This approach doesn't work with state management systems, like Redux, which requires data immutability. This problem can be solved by the use of the ImmutabilityProvider extension component.

React Redux Editable DataGrid Demo | Read more about the Editable React Redux DataGrid

Release Details - FlexGrid

Release Details - FlexChart

Input

Other Release Notes: