I don't use canvas in Obsidian. Tried it when it was released, but haven't used it since. I like Obsidian and want to get the most out of it. I'm curious as too how folks are using canvas in Obsidian.
[deleted]
JSON Canvas Spec (2024)
31–40 of 43 posts
Re: JSON Canvas Spec (2024)
#32Why use this instead of SVG?
It's interactive, for starters. You can do that with SVG, of course, but the boilerplate required would be larger than the `.canvas` file. You can externalize the boilerplate, but then you're no longer creating portable SVG files, and if we're going to create an SVG-like DSL we may as well try out this JSON-like DSL.
This isn't obvious to me. You can have javascript external to the svg for making it interactive, it doesn't have to be embedded in the svg. And the interactivity for json canvas isn't embedded in the canvas json either.
Re: JSON Canvas Spec (2024)
#33[deleted]
Re: JSON Canvas Spec (2024)
#34Earlier quoted context omitted.
ah ok, sorry about that. I didn't really look at that part of the UI much, noticed it had some zoom stuff, noticed I couldn't zoom normally and scroll to where I wanted to read, was somewhat miffed.
Curious to know what “zoom normally” means for you. For me, it’s ctrl+mouse wheel or maybe two finger pinch/pull on trackpad. I am thoroughly confused as to why GitHub’s mermaid integration doesn’t seem to support any zoom outside of the overlay controls which…ick
zoom normally for me is cmd+, the and in my statement meant that when I zoomed I could not scroll to where I wanted to read, hence "I couldn't zoom normally AND scroll to where I wanted to read", I didn't try the zoom buttons and see if I could scroll because I just checked if I could zoom normally, could, but could not scroll to read parts that were now outside the view.
But later I did check using the buttons and it still doesn't allow you to scroll to read parts of the screen that have moved outside of the view because one has zoomed in too far.
Browser was Firefox Dev, OS MacOs. Did Not check if it was specific to the browser OS combination but that is because I doubt it, given my experience that most of these kinds of applications always end up screwing with the scrolling to some extent.
Notice that the JSON spec box on the front page could scroll up and down, but the readme part could not, furthermore the json spec box if I was zoomed in too far was also rendered partially outside of the view horizontally, and could not scroll horizontally. This is of course on the whole window, not individual parts, that scrolling did not work as it should. I'm sure I could go into the page code and find why I could not scroll and then fix it so I could scroll, but I would rather that the whole thing allows scrolling on the window without my help.
Re: JSON Canvas Spec (2024)
#35I don't use canvas in Obsidian. Tried it when it was released, but haven't used it since. I like Obsidian and want to get the most out of it. I'm curious as too how folks are using canvas in Obsidian.
Might just be a question of taste or personal predisposition. I’m only in Obsidian for the canvas, and I spend almost all my time in it. It’s extremely helpful for me to be able to put all of my buckets up in front of me at once, resize them, rearrange them, color-code them.
Re: JSON Canvas Spec (2024)
#36I'm not sure about this: An "infinite" canvas without some notion of recursion such as viewports feels incomplete.
Check out charkoal.dev it has nested canvases and a few other extra features.
It is a great VSCode extension as-is, but the maintainers have abandoned it and they keep refusing to make it open-source. Someone is bound to make an open-source copy soon.
Re: JSON Canvas Spec (2024)
#37Why use this instead of SVG?
It's interactive, for starters. You can do that with SVG, of course, but the boilerplate required would be larger than the `.canvas` file. You can externalize the boilerplate, but then you're no longer creating portable SVG files, and if we're going to create an SVG-like DSL we may as well try out this JSON-like DSL.
Interactive like this? https://yqnn.github.io/svg-path-editor/
I still don't see your point. Why wouldn't I always choose SVG? What problem or pain point is being solved?
Re: JSON Canvas Spec (2024)
#38Earlier quoted context omitted.
It's interactive, for starters. You can do that with SVG, of course, but the boilerplate required would be larger than the `.canvas` file. You can externalize the boilerplate, but then you're no longer creating portable SVG files, and if we're going to create an SVG-like DSL we may as well try out this JSON-like DSL.
Interactive like this? https://yqnn.github.io/svg-path-editor/ I still don't see your point. Why wouldn't I always choose SVG? What problem or pain point is being solved?
It's not interactive for me:
https://codepen.io/ItIsHappy/pen/vEXrXxg
Yes, I'm being pedantic, but that was the point of my comment. SVGs aren't interactive by default, you need to bring your own interactivity.
For static content, SVGs work great, but for interactive content the additional sematic layer of JSON Canvas has a clear benefit. SVGs represent connections using paths, while JSON Canvas uses a graph. This means SVG cannot connect a single node to more than 2 adjacent nodes. If I want to draw arrows from Alice, Bob, and Charlie all to Dave, then I need to create a second Dave or reference to that location somehow. (You can see this in your sword example by moving one of the edge points. The sword delaminates because only two of the four edges at that point can be connected together.) SVG provides limited tooling for this, but it gets rather complicated rather quickly.
Re: JSON Canvas Spec (2024)
#39Earlier quoted context omitted.
Interactive like this? https://yqnn.github.io/svg-path-editor/ I still don't see your point. Why wouldn't I always choose SVG? What problem or pain point is being solved?
It's not interactive for me: https://codepen.io/ItIsHappy/pen/vEXrXxg Yes, I'm being pedantic, but that was the point of my comment. SVGs aren't interactive by default, you need to bring your own interactivity. For static content, SVGs work great, but for interactive content the additional sematic layer of JSON Canvas has a clear benefit. SVGs represent connections using paths, while JSON Canvas uses a graph. This me…
Cool, now show me a codepen with an interactive JSON Canvas?
Re: JSON Canvas Spec (2024)
#40Earlier quoted context omitted.
It's interactive, for starters. You can do that with SVG, of course, but the boilerplate required would be larger than the `.canvas` file. You can externalize the boilerplate, but then you're no longer creating portable SVG files, and if we're going to create an SVG-like DSL we may as well try out this JSON-like DSL.
This isn't obvious to me. You can have javascript external to the svg for making it interactive, it doesn't have to be embedded in the svg. And the interactivity for json canvas isn't embedded in the canvas json either.
If we're adding external interactivity, we're treating each as a custom DSL format and need to evaluate them as such:
JSON Canvas:
graph primitive
easier to read, write, and reason about
harder to render
path primitive
easier to render
harder to read, write, and reason about