GWT JSON based client side (multiple one on top the other) draggable data charts - json

Using GWT on the client side and .NET C# on the server with JSON being the data transport. I would like to send a collection of data points and associated info tip data to the browser/client for multiple data types and I am looking for some client side charting library that would specifically support the following:
Draw a line graph for each collection of data points per data type one on top of the other (i.e. one in a row for each data type).
Be able to click n drag all the charts (together) just like google maps without seening a break in the line graph as long as there is data on either side of the timeline
Be able to manipulate click event on the chart to request further detailed info from the server for the time (to show in a pop up)
I am currently constructing the bitmaps/tiles on the server, store them in a temporary store in memory and then send them to the browser which is I suppose would not be scalable when the number of clients grow and also it is very slow/inefficient.
Any suggestions will be highly appreciated.

There are several client side charting tools with wrappers for GWT.
Here is a list of charts which have gwt wrappers and support line charts:
google-chart-tools (gwt wrapper)
dygraphs
Highcharts JS (gwt wrapper)
Alternatively you could implement your charts also with a charting framework:
Protovis (gwt-wrapper)
Almost all above mentioned charting libraries should support requirement 1 (stacked data) and 3 (interaction) For requirement 2 (drag and drop support) you probably have to do it yourself or extend the charting libraries.

Related

Modal showing Dynamic nested Json data and synchronized with dynamically created buttons (generic ID)

I am developing an interactive web application with ASP.NET Core MVC.
The application consists of reading several items of data from a JSON file, nested in the following way:
Communities --> People --> People data
I have already developed the model, the controller and the view, and I am able to show a grid containing the names of the people available in the JSON file, using this technique from NewtonSoft :
string json = webClient.DownloadString(#"MyJson.json");
model.RootObjects = JsonConvert.DeserializeObject<Rootobject>(json);
My question: I would like to add a popup/window, upon clicking one of the buttons/data cells that contain the person name in the grid.
Upon clicking the modal must show further information from the same Json file that has been used to build the Main Grid (in the index) .
The complexity that I am facing (As I am really new to this kind of dev) is : having multiple dynamic buttons (created from the Json data) then synchronizing between the ID of the button (Or Data cell) and the Specific information being read again from the JSON and returned to the model.
I have tried a lot of solutions which I have found on different websites, I have seen JQuery, AJAX . Tried to build another model for a partial view, but in vain .
I only need some suggestions from your experience. What is the best that you could do in this kid of situations?
Should I go again through developing a new model in my ASP.NET Core MVC and reinvent the wheel? Should I go through pure AJAX, jQuery ...etc ?

Tool to generate web client using JSON Rest Interface

Do any of the front end frameworks (Like Vue.js) have the ability to generate a prototype form/view directly from various an Endpoints?
I am wanting to quickly knock up a few forms to capture and submit data to a set of JSON Rest Post APIs and Display pages to render data retrieved from other JSON Rest Get APIs.
I don't want to have to go through the pain of having to map each and every field out in a set of .js file, it would be great if the boilerplate could just be generated from interface in a similar way to what Apache Isis does from a Domain model.
The above would allow me/clients to generate a UI directly off the interface and interact with it using a web browser in a similar way one would using Postman, without having to install and understand Postman.
You can try one of these:
https://vue-crud.github.io/
https://github.com/dionmaicon/vue-crudgen
https://github.com/ais-one/vue-crud-x - described in https://codeburst.io/vue-crud-x-a-highly-customisable-crud-component-using-vuejs-and-vuetify-2b1539ce2054
https://api-platform.com/docs/distribution/

Dynamic data Binding in Adaptive cards

I am looking for a way where I can bind the dropdowns used in adaptive cards with the data that I will get from my API.
Anyone know how to use https get calls in adaptive cards to prefill data.
Thanks
I'm pretty sure you can't do -inside- the card itself (i.e. from the user's bot client), but it's easy enough to dynamically create the card -before- you send it to the user. There are 3 ways I know of to do this:
1) you can compose the json string for the card yourself, and build up the dynamic options
2) you can using a strongly-typed library to create the card, and build the options dynamically in code (e.g. if you're using C#, you can use this nuget package.
3) you can look at the new adaptive card templating (currently in preview).
I discuss these options more over here: Display number in adaptive card

Flutter: rendering an UI from JSON and store / map data dynamic

I want to render a UI from a jSON string that has multiple layers.
The user should be able to enter data, which will then be stored and shared, without the overhead of the jSON Render Structure.
However, the assignment of the data must be possible.
The app renders a template from a multidimensional json string that can capture metrics (user inputs). The measured data are entered via text fields by the user.
There are different windows in the app, which are rendered from different json UI-render-files.
The stored algorithms in the windows at the Frontend differ.
The following should be possible:
All windows are created with different jSON strings (works with build_value now).
The user's input is saved. (Currently only works by saving the render json string with the data under a different name (with Package: Shared Preferences)).
The data entered by the user is copied from one window to the other window. (Data Binding / Data Mapping)
The data entered by the user will be sent to a backend.
I only have the idea to use id's in the render json, which allow a mapping.
Are there better solutions?
Saving the entered data is possible by saving the whole jSON - String with an other name.
The goal is to map the data.
It should also be possible for the user to insert another object for the measurement data acquisition at the client / device. The entered data must also be saved.
This sounds like a REST API. Then you would use a frontend framework like angular or react to take user input.
I could build this with a .net core web api with sql db as the backend. this would be a web service (REST API solution) on the backend of your solution.
Next I would integrate Swagger with dependency injection and add authentication.
now its time to create the front end that will use your tested Web Service.
you would have 1 side of your SPA POST new JSON to the Web service in a form.
you would have the other side GET the new record as a new tab with pagination or in a table with pagination.
This would be a good PoC for your idea and will let you learn the parts of the solutions architecture in your language of choice. the "design" would be the same no matter what language your choice.
backend web service can be done in a flask and with a MySQL DB. or with any other combo you have skills with.
the Frontend could be done in knockout.js, making it a little easier to learn than angular or react.
Please create new questions when you choose your software design. I would love to give answers for each:)
I would love to level up with you! ;)

how to populate a store with a single json object in gxt3

I am using Sencha GXT3 app for a html interface. Data is retrieved in json format from a REST service. How exactly do I fill a store with a single object for reading and later manipulating and saving?
This is not about lists of objects, but really a specific single json map which I want to load into a store.
Any help would be highly appreciated.
For Stores you have basically two choices list or tree. Right? GXT 3 store api
You say it's not a list so did you see the src of their json tree example
Personally for a single object, I use a list. I mean it's a list of size 1. json list example
Of those two examples, json tree example is easier to understand since it's not using a grid I think. There are tree grid examples too but none I immediately see with json.
This is for version 3. I see no reason why you'd want to start with 2 since 3 is much more similar to native gwt and you can mix 2 and three code (see their tutorial) until you get everything ported to the newer version. Just saying ...