- Roman Gavrilow asked 3 years ago
- last edited 3 years ago
- You must login to post comments
Hi Roman
SciChart.js fills the div that you specify in your application when you run this code:
// Html or TSX/JSX
<div id="some_unique_div_id"></div>
// Javascript code
const {sciChartSurface, wasmContext} = await SciChartSurface.create("some_unique_div_id");
The SciChartSurface always expands to fill the div, so all you need to do is to have some CSS or JavaScript to expand the div to fit available space.
Take a look at these StackOverflow questions:
- How to make child div expand to parent div
- CSS – Expand float child DIV height to parent’s height
- How can I expand a child div height to parent height?
Let me know if this helps,
Best regards,
Andrew
- Andrew Burnett-Thompson answered 3 years ago
- You must login to post comments
Hi Roman
Update: Fixed in build 1.1.1346 or greater
This issue is fixed in build 1.1.1346 or greater which will be published soon. To get the SciChartSurface to fit full width / height of an application, you need the following markup.
<body style="margin: 0;">
<div style="height: 100vh;">
<div id="scichart-root" style="width: 100%; height: 100%;"></div>
</div>
</body>
This results in a SciChartSurface stretching to fit the browser window.
Demo application code found here:
- Browser version https://github.com/ABTSoftware/SciChart.JS.Examples/tree/dev/Sandbox/CustomerExamples/SizeSciChartSurfaceToFitHeight
- Electron version https://github.com/ABTSoftware/SciChart.JS.Examples/tree/dev/Sandbox/demo-electron
Best regards,
Andrew
- Andrew Burnett-Thompson answered 3 years ago
- You must login to post comments
Please login first to submit.