rcarcasses / vue-cytoscape

cytoscape.js now inside vue.js
https://rcarcasses.github.io/vue-cytoscape
MIT License
96 stars 34 forks source link

Element height hard-coded to 600px. Seriously? #47

Closed dataway closed 5 years ago

dataway commented 5 years ago

The element size is hard coded, in particular the height is set to 600px. Come on man.

https://github.com/rcarcasses/vue-cytoscape/blob/58af89b97a528bda9b1e20ed48822d3e6c499077/src/components/Cytoscape.ts#L28

rcarcasses commented 5 years ago

it is the minimum height possible, not the height, what is set, moreover you can override this, this helps a lot as it happens that many css framework will give zero height by default to the component and you see nothing.

I encourage you to be more constructive next time you open an issue.

andradf commented 4 years ago

Any suggestions on how to override it? From the outside of the Cytoscape component we don't have direct access to the container element.

rcarcasses commented 4 years ago

I think you can write like:

# cytoscape-div {
    width: 1000px;
}

let me know if it works for you.

mfigueredo commented 4 years ago

A tried a lot of ways to override the min-height however without any sucess. The solution to put width: 1000px; does not work. I cannot override the heigth to my desired value because it is smaller than 600px.

Any suggestion to this situation? Thanks in advice!

rcarcasses commented 4 years ago

Hi @mfigueredo, what about changing css at runtime?

document.getElementById("cytoscape-div").style.minHeight="100px";
mfigueredo commented 4 years ago

Hi @mfigueredo, what about changing css at runtime?

document.getElementById("cytoscape-div").style.minHeight="100px";

This worked for me. Thank you a lot, @rcarcasses.