I'm trying to implement a scatter plot chart chart inside an SAPUI5 application. I've done some research with other charting frameworks that are more common with SAP (Vizframe), but they are limiting in its supported features (ex: vizframe doesn't support a regression line).
I cannot find an easy way to integrate a d3 chart into a SAPUI5 control. Can anyone provide some guidance on how this can be accomplished? Examples help!
Here's the chart I'm trying to implement:
https://bl.ocks.org/ctufts/298bfe4b11989960eeeecc9394e9f118
Best way is to implement your own custom control based on D3. Library is already available at the SAPUI5 resources here;
jQuery.sap.require("sap/ui/thirdparty/d3");
Some examples;
http://jsbin.com/zutamig/edit
http://jsbin.com/hacuw/1/edit?html,output
https://blogs.sap.com/2014/07/17/custom-sapui5-visualization-controls-with-d3js/
Chart library based on ChartJS, if you want to check;
https://github.com/SAP/openui5-charting-custom-controls
Developing Custom Controls;
https://www.youtube.com/watch?v=W3Qkev2yk9w
https://www.youtube.com/watch?v=Nw8SnXZFqrs
Building Custom Controls to Visualize Data;
https://www.youtube.com/watch?v=cY-WCWC1qxE
Related
Does kendo provide any way to implement heat map chart similar to highcharts heat map chart?( Highcharts heatmap demo example)
I just found this heatmap.component.ts in their Angular GitHub project. So, yes, it can be done with custom code.
like other chart tools, is there any option to develop animated webix charts,
Animation like
When Loading rotation of Donut,
Click to Zoom,
Block Seperation in pie,
Label Ruler in pie,
I am afraid that Webix Charts are not the best choice if you want charts with animation effects and other visually complex things. Webix Charts are great for loading, presenting, grouping, filtering data, and for CRUD operations on them, but they are not as sophisticated as charts from some other libraries that are dedicated to charts specifically.
Webix allows for third-party components integration. That's why I would recommend you to use some other library charts and integrate them into your Webix UI. You can use some of the ready-made integrations from this repository and you are very welcome to contribute your integration. You can use these guides in the process:
https://docs.webix.com/desktop__chart_integration.html
https://blog.webix.com/using-third-party-libraries-with-webix-ui/
I'm working on a project where I want to represent different data with the same date range on x-axis using nvd3 (angular).
My idea is to synchronize guideline among different charts and onmousemove or using a slider I want to show programmatically guideline with a tooltip in each chart (e.g. like heroku does)
Can anyone give a hint to a solution or if it's possible to control interactive guideline programmatically?
We have multiple charts developed in d3.js. We are creating a dashboard where user can add multiple charts which will be visible in one view.
Is is possible to create interactivity between these charts and dc.js? Or do we need to develop these charts in dc.js again?
Please suggest an alternate in case of No.
I want to add zooming functionality using d3.js in a bar chart created using dimple.js. See following link for what I did so far. http://jsbin.com/rejof/2/edit
I want to combine both zooming functionality in dimple chart. Thanks in advance.
I don't think you can easily do this, you would probably need to modify the dimple source code as I believe zooming relies on a different dom structure to the one dimple uses. You might find it easier to recreate the chart you require in raw d3, rather than modifying a dimple chart to zoom. Of course I'd love to be proven wrong.