Creating charts with Netzke - extjs

Does anyone knows the way to create ext js charts with Netzke? I guess there is no such component right know, but maybe someone have an idea.
What are the basic steps to connect using Rails and EXT JS, without Netzke?

I have looked at that gist and this https://gist.github.com/1190511
But I still can't figure it out. Is there a chance to see, no matter how simple a working version of the simplest chart in the Demo app or anything else? I understand the EXT side but I am having a real problem in putting it together with Netzke. I know I am missing something really simple.

A chart component is too application-specific, but it's surely possible to create one using Netzke built-in client-server mechanisms. Here's a demo: http://variant.herokuapp.com (try selecting different dates on the calendar to see the charts updated on the fly). Here's a gist for the LineChart component used there: https://gist.github.com/4112061 - hope, it can give you an idea (Netzke 0.7.x).

Related

React tsParticles (fireworks) not working

I'm trying to use react-tsParticle. I'm interested in "Fireworks preset" but unfortunately that is not working.
I've seed some examples like this codepen one.
But If I use that option/config that doesn't works. it created some fireworks blast in the bottom but its useless screenshot.
But If I use that codepen example in that way that works. But that's not how it meant to use in react. Any help will be appreciated.

How to style mgt components

I'm using the MGT with React. I am trying to style the component in the same fashion as the rest of my application (reactstrap).
I've found the custom CSS properties you can set, which has got me 90% of the way there, but I need to be able to adjust the margins of the control (margin-left: -3px) and I can't seem to do this no matter what I try.
I think the answer to my problem lies in using the templating functionality but the documentation is a bit lacking for this.
Any ideas where I should start with this? Am I on the right track? Does anyone know of an example of using templates with the PersonPicker component?
Without specifics, there definitely might some css properties that we haven't exposed yet. I don't think there would be any recommended code to use here, instead I'd highly suggest opening a an issue on our github repo as a feature request. We can then work with you on improving the toolkit with these properties.

React Form with subtotals

I worked wth AG-Grid but not sure we can achieve a design like following. I tried but no luck.
Could someone help me to develop a form with subtotals? I know we have a Pivot library but we cannot achieve a design like the following. Could someone please help whether any library exists or some basic idea of how to develop a form like this?
Please note we need filters and sorting, as AG-Grid provides it by default on top.
Thanks
I would suggest you use Materias-ui Tables. They are incredibly versatile and easy to use because of good documentation and examples on the official website.
Therefore, I can see that your desired result can be achieved with Collapsible table and Sorting & selecting. Although I suggest you read the whole page.
https://material-ui.com/components/tables/#collapsible-table

Could i use react-virtualized for rendering and modifying large tabular data?

I would like to build a service that can manage large dataset by grid view. It's similar to Excel or Google's Spreadsheet. The service can render and modify directly on the grid view.
I would like to use react or some latest technology to develop the front-end. I found a react component named react-virtualized.
I still wonder that can it implement modification functionality on it.
Could you explain me more about how it work or under the hood ? Actually i need some idea to propose the solution like this.
Could i use react-virtualized for rendering and modifying large tabular data?
Yes.
Sounds like you're looking to build something like this. It is built with react-virtualized and the source code for it can be found here.
Could you explain me more about how it work or under the hood ? Actually i need some idea to propose the solution like this.
This question is a bit too vague for Stack Overflow I think. You might find this talk informative since it kind of covers the basics of react-virtualized. After that I would suggest browsing the documentation.
Once you have a foundation then more specific questions could be directed here or to the react-virtualized Slack channel.

Migrating from Ext JS 2 to Ext JS 4

I am getting this error on page load itself.
Error: [Ext.extend] Attempting to extend from a class which has not been loaded on the page.
javascript//ext-4.1.1a/ext-all-debug.js
Line 4391
I'm not able to render the page at all. Any ideas?
I have also used extjs4 compatibility for migration.
Are you using all of the resources outlined here, including the screencasts? The videos take a little time commitment, but I think you'll find them quite helpful as they walk through several examples of how to debug exactly these types of issues. Learning to debug effectively will be the best way to tackle this type of migration.
There's no class named 'TreeNodeUI' in ExtJS. If you want treepanel, then you need to extend 'treepanel'. Please have a look at examples given on Sencha website before trying out any code.

Resources