Comments (2)
I was unable to reproduce his results. Adding viewBox
did not make it resizable. I then doing that and removing the width
and height
attributes, and the diagrams disappeared completely. Finally, I tried adding viewBox
and width="100%"
and the diagrams did become scalable, but they only took up half of the available content area width, so normal diagrams with sixteen columns were tiny, half as big as they should be, and diagrams with four columns were huge, double the size I wanted.
So unless there is more information about how to do this, I need to stick with my original design intent of fixed-size images. I’ll leave this open for a while in case further information comes in.
from bytefield-svg.
After further clarification from @Mogztter I have been able to verify that simply adding the viewBox
allows the SVG to be responsive at the discretion of the CSS. max-width
is a CSS style, and applying it in combination with the width
, height
, and viewBox
SVG attributes makes the diagrams behave very attractively at all window sizes of my documentation sites.
from bytefield-svg.
Related Issues (20)
- Add support for bit fields HOT 5
- Pull in some useful functions from other namespaces
- Omit XML processing structures for generating HTML embedded SVG
- Declare the namespaces in the <svg> HOT 8
- Support rotation of box labels HOT 6
- defattrs should call eval-attribute-spec
- Long boxes HOT 11
- Variable row height HOT 17
- Add more examples HOT 3
- Set svg background HOT 4
- Allow boxes-per-row > 16 HOT 4
- CLI Error - Could Not Resolve Symbol: Address HOT 2
- Support automatic dark mode HOT 4
- Add draw-column-headers Function in bytefield-svg HOT 3
- boxes-per-row can't do 32? HOT 7
- draw-box should auto advance rows
- Have draw-gap handle labels and finishing previous row
- Small/vertical draw-gap function HOT 10
- Support padding to a particular address
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bytefield-svg.