Responsive to screen size, excluding text

[elinake]

Introduction

I need the graph to be full screen width for all screen sizes, I'm achieving this with listening to window:resize and then calling
this.paper.transformToFitContent().

However, scaling affects the labels also, when the text is normal on big screen it will be unreadable on small screen. I'm a bit lost why this would be the default behavior for text. Is there something crucial I'm missing? I have tried the different paper scaling functions like fitToContent etc. but no success. Is there a set of options I should use to achieve the text being always the same size? Or is there a way to tell the element that its label should not scale with rest of the content?

Steps to reproduce

No response

Restrictions & Constraints

No response

Does your question relate to JointJS or JointJS+. Select both if applicable.

JointJS

[kumilingus]

If you want to resize the elements to fit your paper, you should scale the models rather than scaling the paper (zoom in / out).

For instance:

const b = graph.getBBox();
const s = paper.getArea().maxRectUniformScaleToFit(graph.getBBox(), b.topLeft());
graph.translate(-b.x, -b.y)
graph.getCells().forEach(cell =>  cell.scale(s, s, new g.Point(0,0)))