> Regarding SVG scaling, I haven’t specifically used D3, but I’m sure it makes scaling issues easier. However, scaling in SVG is still something > that requires you to think through the relationships of your objects. It isn’t magic, and it can’t guess what you have in mind.
Well said. Also, I should have made the point more clearly that you can get the scaling library from D3 _without_ the rest of D3. No need to buy the whole pig if you just want a pork chop. On Wed, Sep 20, 2017 at 11:55 PM, Tom DeMeo via 4D_Tech < [email protected]> wrote: > Hi, > > > > SVG is a whole lot easier to manage in JavaScript. If for no other > reason, > > you've got access to the D3 libraries. > > I would strongly concur with David Adams point that you want to manage SVG > with javaScript instead of the 4D language. This is an object oriented > scheme, and its pretty difficult to work with if you don’t have an object > oriented language to work with it. The D3 libraries or some other library > are important too, but the language itself is truly important. > > > > * He's also pretty into that freight-car-function style from jQuery > which I > > hated on sight. But it does make it easier to set a ton of properties > > legibly in a compact space. Virtually everything in D3 is set to return > in > > a way that supports this syntax so, yeah, be aware of that. > > > This style is really just accepting a single hierarchical object of > parameters. You can write code that defines attributes in objects in a lot > of different ways in javaScript. I’d recommend to anyone that they spend > some time considering a coding style that appeals to them and always try to > do it the same way. The syntax the library’s examples shows you is not > mandatory. Its just a javascript object, and as long as you respect the > underlying architecture of that object, you can use whatever syntax you > prefer. > > > Regarding SVG scaling, I haven’t specifically used D3, but I’m sure it > makes scaling issues easier. However, scaling in SVG is still something > that requires you to think through the relationships of your objects. It > isn’t magic, and it can’t guess what you have in mind. > > Consider the scheme on a 4D form. In 4D, the form itself and the objects > have sizing parameters (none/move/grow). Splitters can provide additional > control. Its a nice, simple scheme. However, if you don’t bother to set > these parameters, you don’t get the scaling you want. > > A few years ago, I worked out an HTML layout scheme using a different > javascript library, Raphael. I wrote a code library so that I could set > move/grow parameters just like 4D provides in its forms, which I think is a > pretty smart scheme. I haven’t done anything with it for quite a while, but > I’m still hosting a demo, so you can check it out: > > http://www.svglayout.com/svglayout/index.html <http://www.svglayout.com/ > svglayout/index.html> > > When you get there, click on the SL widget in the upper right corner to > activate the editor. You will see object outlines and handles and can drag > objects around. You can also double click on an object to see the sizing > and scaling attribute dialog. The whole site you see is built using an SVG > based layout scheme. Traditional HTML layout strategies are not used. > > > > Tom DeMeo > > > > > > > > > ------------------------------ > > > > Message: 5 > > Date: Wed, 20 Sep 2017 09:02:08 +1000 > > From: David Adams <[email protected]> > > To: 4D iNug Technical <[email protected]> > > Subject: Re: SVG Scale > > Message-ID: > > <CAPXPcQuGQLLuErPSzmzZwOLy0192z0WcHBS2BisfA6r8Kf3K=A@mail. > gmail.com> > > Content-Type: text/plain; charset="UTF-8" > > > > SVG is a whole lot easier to manage in JavaScript. If for no other > reason, > > you've got access to the D3 libraries. In V4, Mike Bostock wen to a lot > of > > effort to break bits out into stand-alone libraries to make reuse easier > > without the whole D3 environment, and to encourage contributions from > other > > people. One of the core features of D3 is the scale: > > > > https://github.com/d3/d3/blob/master/API.md#scales-d3-scale > > > > And a couple of examples from Mr. Bostock: > > > > Quantile, Quantize, Threshold Scales > > http://bl.ocks.org/syntagmatic/29bccce80df0f253c97e > > > > Linear & Ordinal Scales > > https://bl.ocks.org/pstuffa/c37d059efa1501d33913d63ffe3585db > > > > It's super powerful. Like most things D3, you define an object that is > > implemented using JavaScript's (very nice) closures.So, you end up with > an > > object that can perform scaling operations. The object can be passed > around > > as a parameter and it can be invoked as such. What's nice about the > closure > > in this case is that you can manufacture a whole bunch of different > scales > > - you set the values when you build your scaling object. Then you pass > the > > pre-defined scale object, as needed. The object caries the scaling > function > > internally. It's very tidy and very powerful. There's nothing remotely > > similar in the 4D language, so there's no way to make a meaningful > metaphor > > for this sort of structure. > > > > Scales in D3 can be of all sorts of different types, including ordinal, > > continuous, and sequential. If you need animations, I think that the > > interpolation features lock in here too. It takes a bit of time to get > your > > head around D3 scales, or at least it did for me when I was using D3 > > heavily, but after that, they're a snap. No more hassles. Super powerful > > and super easy, once you've got the hang of it. > > > > Notes: > > * Mike Bostock's JavaScript relies heavily on anonymous functions. I > don't > > really get it why JS people love them so much. But M. Bostock is way > > smarter than likely anyone I've met, so I figure roll with it. > > > > * He's also pretty into that freight-car-function style from jQuery > which I > > hated on sight. But it does make it easier to set a ton of properties > > legibly in a compact space. Virtually everything in D3 is set to return > in > > a way that supports this syntax so, yeah, be aware of that. > > > > ********************************************************************** > 4D Internet Users Group (4D iNUG) > FAQ: http://lists.4d.com/faqnug.html > Archive: http://lists.4d.com/archives.html > Options: http://lists.4d.com/mailman/options/4d_tech > Unsub: mailto:[email protected] > ********************************************************************** > ********************************************************************** 4D Internet Users Group (4D iNUG) FAQ: http://lists.4d.com/faqnug.html Archive: http://lists.4d.com/archives.html Options: http://lists.4d.com/mailman/options/4d_tech Unsub: mailto:[email protected] **********************************************************************
