How to control the aligning in highchartjs Venn diagram, with React - reactjs

I'm using highcharts, the Venn module (highcharts/modules/venn.js), and using the highcharts-react-official package to support it in React, the need to show the Venn diagram circles as shown here:
This is what I have now:
However, I tried to figure out away to do this using legand.layout but did not manage to modify the alignment to get the that results, here's what I get.
Any Idea how to do so, if providing the code for that would help more, I'll be happy to share, but I thing either there's an API that I'm no able to find, or its not supported and I have either to find another solution or find a workaround
Really appreciate your time & help

Related

use of findNodeHandle in react

I recently came across a use-case where I need to measure the components dimensions on runtime. On exploring the solutions I found a tutorial which uses a built in method called findNodeHandle. To be precise it was getting used as first argument of measureLayout method.
I tried exploring the use of findNodeHandle but could not find anything.
Can anyone please guide me a little bit on what exactly findNodeHandle does in react.

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.

How to integrate Go.js's floorplan with React.js

I wanted to create a react project allowing a user to annotate floorplan thanks to Go.js's floorplanner here is the link https://gojs.net/latest/projects/floorplanner/FloorPlanner.html. If you look visit that link and down below you will see the scripts that were used to create floorplanner. But instead of creating the floorplanner with vanilla JS I wanted to use React.js. Can someone help with the integration of Go.js's floorplanner with React?
This question is too vague for an easy answer. You should look at the react example: https://github.com/NorthwoodsSoftware/gojs-react
And modify it to your liking. This can involve taking large parts of all of the floor planner sample, though if you have no practice with GoJS this it may be worth taking the time to learn everything involved in the sample, before any integration.

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.

Creating charts with Netzke

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).

Resources