NEW VERSION RELEASED! Webix 11 Read More Core Updates, Extended Functionalities in SpreadSheet and File Manager and more

WEBIX JAVASCRIPT LIBRARY BLOG

UI development best practices, front-end programming tips and news to speed up your Web development.

Follow us:

Write for us: learn about our guest posts guidelines.

Import / Export in Webix 3.0

Web apps are dominating in the modern software development. Born as stateless pieces of HTML, they have evolved to dynamic and smart applications, still bound to the browser and the HTML markup. The next step of evolution is happening just now. A web app is moving beyond the boundaries of the browser. On the one hand, we already have desktop and mobile apps which, in fact, are wrapped web apps, on the other hand, web apps learn how to interact with desktop apps.

In Webix 3.0 we have added a few new API to simplify such a client <-> desktop data interchange.

Data Export from a web app

With Webix 3.0, you have two very powerful data export commands. They are:

webix.toPNG($$("chart"))
webix.toExcel($$("datatable"));

export to png

Those commands allow exporting any Webix component to PNG or Excel. In the case of export to PNG, you can use API with any HTML content. Yes, you can export any HTML content on the page to a PNG image.

// export the whole page to an image
webix.toPNG(document.body);

Grow with Webix: Real Showcase from BNDC company

Bonjour everyone!

Another week, another cool showcase from our customers. Today we are glad to present an article from Bruno Denis from french company BNDC. The project, which was made on Webix, is called MyMetriks. So here you go.

MyMetriks is a simple and intuitive dashboarding platform. Build 100% HTML5 and nodejs, it gives to all users possibilities to create/customise the dashboards they really need. It is cheap, based on all latest technologies and really fast thanks to in-memory data cube management.

Dashboard Design

MyMetriks made on Webix

 

All operations are done via simple click or drag and drop, even dashboards creation. All the solutions are based on Webix framework. We have developped our own Nodejs ajax JSON adapter based on Webix proxy. The platform is fairly simple: nodejs, mysql, Webix and a specific columnar database for Business Intelligence performances.

Grow with Webix: Real Showcase from Glasslink Company

Good day everybody!

Today we begin to publish new articles that describe the real use cases which were made with Webix by our customers. And the first article was presented by our customers Lars Kjebekk and Yuriy Klyuch from the Glasslink company.

“My name is Lars Kjebekk and I run the company called Glasslink. We specialize in glass and facade consultancy and also do some custom IT solutions. I have worked a lot with automating processes to improve efficiency and also provide the end users with better service.

Glasslink was contacted by Polyteknikk as they wanted to bring their service to the web. Polyteknikk is a manufacturer of professional tag signs for offshore, building and other fields that require technical marking.

The final result is //myglasslink.no/webix25/polyteknikk2/index.html

The idea was to create a web portal where customers could login and design their signs online.

After a lot of sketching and brainstorming, we ended up with a 4 step wizard to design the signs. We have also implemented dynamic image view that shows the changes in colors, fonts, shapes, etc. in real time.

Design Wizard View

WebixShowcase

Highlight your company with Webix

Hi, everyone!

They say that Monday is a tough day. We say that Monday is a right time for new beginning. That is why today we decided to start our new project, in which everyone, who deals with Webix, can participate.

Highlight your company with Webix

 

I think, you will agree that before you buy a product or a service, it would be cool to read the reviews of people who have already used it. And if we are talking about building applications, it would be nice to see real cases that have already been created. That is why every week in our blog we will publish an article that describes a real use case which was made with Webix by our customers.

Everyone, who has a product or an application made with Webix library! If your project is not internal, confidential or private, and you want to share it publicly and highlight your company in our blog – my email is open for your cool articles.

What we expect to get: a full description of your product, for what purpose and for whom it was developed, 3-5 screenshots, as well as the information about your company (link to the website or your blog, your company’s name and the name of the product), and any additional information you want to share.

By the end of this year we will publish all the articles. Then we will choose the most interesting application or solution based on Webix JavaScript UI library and announce the winner.

Hurry up, maybe exactly your app is the most interesting one!

Working with nested data in Webix UI

We all like to use simple apps where an interface is easy and straight. Creating such apps is a breeze, just put some HTML tags, add a UI framework of your choice, something like Bootstrap, for example, and the app is ready.

In real every-day development, things are bit different. It is common for a business app to work with complex data, that requires some advanced UI to represent it. A nested data is one of such use-cases. There is no a ready to use solution to show such kind of data in raw HTML or in Bootstrap. For such kind of task, you need a more powerful tool. Something like Webix UI.

Webix has also developed an in-house solution for managing large volumes of aggregated data in business web apps: the JavaScript Pivot Table. This tool analyzes and displays data in a tabular format.

Tree

The simplest widget that can be used to show nested data is a Tree. It is common UI element for desktop apps, but still rare in web apps. Webix Tree has all common functionality of tree widget; it allows to represent the hierarchical data as a tree, where branches can be expanded or collapsed. Additionally, Webix Tree is really fast. It renders thousands of items in less than 1 second. And if that is not enough, you can utilize a dynamic loading feature to load data on demand.

webix.ui({
view: "tree", data: nested_data
});

 

Webix Tree

1 46 47 48 49 50 64