jo-pol / dibl Goto Github PK
View Code? Open in Web Editor NEWAbandoned predecessor of GroundForge + gif based Flanders grounds.
Home Page: http://jo-pol.github.io/DiBL/
Abandoned predecessor of GroundForge + gif based Flanders grounds.
Home Page: http://jo-pol.github.io/DiBL/
The initial sample on http://jo-pol.github.io/DiBL/tensioned/ allows to change the colors of threads. The generated thread patterns don't even show the square starts of threads. The links don't yet have the attributes that identify the thread number.
Flanders and brick templates have thread and pair versions to allow generating matching diagrams. A lace maker has only complex clues to actually create lace from a diagonal template: the legend on the left of the diagram and the matrix in the form.
At least shorten the length of the links in larger diagrams.
See the force parameters
and tick algorithm
See also:
https://github.com/mbostock/d3/wiki/Force-Layout#linkDistance
http://grokbase.com/t/gg/d3-js/1375rpwbdt/consistent-force-directed-graph-generation
http://grokbase.com/t/gg/d3-js/137xwsrbd4/how-to-dynamically-adjusting-linkdistance-and-linkstrength-to-help-reducing-crossing-edges
Once we can turn pair diagrams into thread diagrams we also have the building blocks to develop a recipe like language that can turn some description into a diagram. For example something like (tctc(1-2),lctc(2-3),ctc(3-5),tctc(5-6),lctc(5-4),ctc(4-2))*3
for 6 cloth stitch rows of a simple band with three passives and foot-sides. The number between braces meaning which pair are involved, for example ctc(3-5) means work pair 3 in cloth stitch through pair 4 and 5. Increasing numbers meaning working left to right, decreasing right to left. The pair diagram in ASCII art:
|/ |
|\___ |
| \|
| ___/|
|/ |
|\___ |
| \|
| ___/|
|/ |
|\___ |
| \|
| ___/|
to get consistent numbers with the original repository
see also #11
The dimensions of the matrix are adjusted, but the possible stitches not
The form to generate diagram may be daunting. Add a more-less toggle that shows/hides the shift / image-size options
When pushing the 'draw' button to show another grid, the dot pattern turns from '011,101,211,101,011,121' into '011%2C101%2C211%2C101%2C011%2C121'. When pushing again, the field is reported as invalid.
broken since cabffd1
The source graph.scala is quite large due to the hard coded matrices. The hashmap even runs into limits ob object size when not constructing it from other objects. Though the JavaScript generated from the scala sources is cached and transferred in a zipped form, too many matrices may cause occasional unacceptable load time.
It is not necessary to store both incoming and outgoing pairs for each stitch in a tile. The incoming pairs can be deduced from the outgoing pairs or vice versa to reconstruct the full tuples. Outgoing pairs for interleaved tuples have 10 permutations, diagonal tuples even less. So a matrix can be stored with a string containing just a single decimal digit per stitch. It must be strings as integers range little over 9 digits and we need 16 for 4x4 matrices. For the size of the source code string or integers hardly matter. Eliminating the deduction of incoming from outgoing pairs, we have 70 permutations, meaning digits plus the alphabet in lower case and upper case and 6 more characters (or the ASCII characters [0-Za-y]) would result in the same string length. A simple hashmap can convert these characters to the desired tuples.
the pair diagrams on http://jo-pol.github.io/DiBL/tensioned/ have bobbins dangling at the end of a patch, add them to the pair diagrams to.
I make bobbin lace, want to do a circular grids and apply on them any of base elements of lace. Please tell me how to do it.
About the ground generator
When generating a link definition, the titles (rendered as tool-tips) of source and target nodes should be examined to determine the type of markers. We also need some mapping to translate these titles to markers, for example tctc means red, ctc means purple (#660099) and tc means green for the adjacent links. Additional twists at the start mean a mid marker, in ascii-art the link should look like ---+---
. Ask the specialists in the bobbin lace community how to render special stitches like ctctc and cttc.
For now only start markers and end markers are implemented. There seem to be two solutions for mid-markers:
The thread diagrams are not only incomplete because the foot sides of the thread diagrams are clumsy. The diagram below shows that the algorithm also fails to 'see' it can do the purple stitches end hence three star shapes. The screenshot is taken from development view which shows faint versions of invisible nodes and lines.
The scala.js code returns arrays that are somehow wrapped from the JavaScript point of view. The optimizer invents different identifiers for the actual array per release. The browser debugger can reveal the chosen identifier to adjust the workaround in the JavaScipt.
Please try to convince scala to produce unwrapped arrays.
http://jo-pol.github.io/DiBL/grounds/
Clears the message "loading script, please wait... " after a while, but nothing else happens, at least not for a while.
Mobile devices might need a long time (dozens of seconds) to render the complex SVG diagrams. A Flanders or 2x2 pair diagram will be the fastest to try and see if it works at all.
If no diagram appears after a very long time, please report the circumstances, it might be more than a performance issue.
to get consistent numbers with the original repository
That could have many causes.
A known cause: after reloading the page you might need once to select another template to get started.
The original problems are fixed, but note that you have to right-click and select "save image", do not save the page.
After applying "show in other tab" while generating a ground and saving the generated page locally, an application like InkScape will not open the saved diagram.
When opening a diagram saved with Safari or IE the diagram does not contain the chosen stitches but the original template. FF and Chrome are fixed for this matter.
Partial workaround: Open the saved file with a plain text editor, strip the few HTML lines at the top and bottom and save the result with an SVG extension. InkScape will open the modified file.
Rather implement zooming both diagrams than having to specify the size of the images.
Choosing zero in the "nr" field on the ground genrator, results in something different than another number, but all the other numbers seem to result in the same diagram.
When applying the "show" button on ground some cryptic text appears in stead of a diagram
So far the attribute inkscape:label was used as it shows up in the XML tree view of InkScape what made manual editing more comfortable. Using this attribute might lead to conflicts. A technical better solution would be to add attributes in a dibl namespace. The namespace means an additional attribute for the root-element: xmlns:dibl="https://github.com/jo-pol/DiBL/svgNameSpace"
expected attributes:
can we learn something from
http://www.iis.sinica.edu.tw/~trc/public/publications/svgopen03/
So far only pair diagrams can be generated from predefined matrices. We need also thread diagrams for real added value over the template based diagrams.
The generated D3-data (just before conversion to a raw-js object) can be input for an algorithm that generates pair diagrams. Strip all properties but the source/target of links, and the title of nodes. Some mapping from node-title to predefined snippets per stitch for thread stitches might help to replace the nodes in the pair diagram. The file sample.js
contains an example snippet for ptcptc, note that no stitch has two pins, they sit there to demonstrate the behaviour of pins. Do not connect this example (with substituted node numbers) by merging nodes but by merging links. The merged link starts at the source of the bobbin-link and ends at the target of the start-link as illustrated with the double links in the image below.
The drop downs to choose stitches should show all stitches supported by the selected template and no other stitches. That reduces the explanations that are now required.
The java version of the ground generator has options to flip or rotate a pattern before applying the stitches. This option is still missing in the scala version.
following the procedure on http://jo-pol.github.io/DiBL/grounds/ with a .sh file works fine but a .bat file results in:
Exception in thread "main" java.lang.IllegalArgumentException: 3
expecting two numbers on the first line with the dimensions of the matrix
at dibl.Main.readMatrix(Main.java:122)
at dibl.Main.<init>(Main.java:67)
at dibl.Main.main(Main.java:54)
https://github.com/jo-pol/DiBL/releases/download/tiles-0.1.3/dibl-tiles-0.1.3-bin.zip
contains .txt files in the input folder that are in unix format. The program does not recognize the lines when launched with a .bat file.
fix either the two occurrences of reader.readLine() in standalone/tiles/dibl-tiles/src/main/java/dibl/math/Matrix.java or package the files in windows style.
With the generated ground it is less obvious to create a link to a certain configuration, and vice versa to create variants by filling in the form with the arguments of a link. Combine the pages with the form and generated ground like for the polar grids and fill in the form with the arguments. Note that the generated ground performs badly on mobile devices, so a link without at least a template parameter should not generate something from defaults but a pre-cooked teaser.
Pins in thread diagrams can be added through stitch definitions. This issue is about interactively adding pins to a generated pair diagram.
When a user clicks within some polygon of surrounding links, add a pin connected with invisible links to the nodes of the polygon, see the sample.js. The spreadsheet-like index in the titles of the nodes tell where to repeat the new pin, see also the scala-doc of Matrix.toCheckerboard.
See also #12 for flipping and rotating, the matrices now have a different format so the old code can't be reused though the same principles still apply.
With the D3.js implementation and foot-sides ( #24 ) we need an option to shift the matrix before generating a diagram. Thus we can choose which part of the pattern becomes the left edge.
Adding foot-sides to diagrams can help to plan colored threads in a piece of lace.
The image below is a manipulated screenshot of a diagram in a development environment. It shows faint links and nodes which are completely transparent in the github.io demo. Blue dots are added to indicate the intended positions of pins in the foot-sides.
You can get the development view by launching sbt ~fastOptJS
from the web/tensioned
directory of your local clone. Then you can examine a stripped version of the demo page with http://localhost:12345/target/scala-2.11/classes/index-dev.html
NB: do not copy the development JavaScript of the master branch to the gh-pages branch without making the faint links and nodes completely transparent again. Rather experiment in the gh-pages branch with the data in sample.js
and copy the gh-pages version of show-graph.js
to the master branch and make the fully transparent items a little less transparent in the master branch.
The transparent links serve to keep the loose ends in proper order. Otherwise thread number tool-tips might get twisted and bobbins in foot-sides point upwards. Additional nodes on the corners might improve the aesthetic impression. For a simple proper foot-side, the nodes of bobbins and the next pair-start should merge into single nodes, the remaining transparent links in the foot-sides should become black. The links along the top should remain transparent. See the sample.js
for adding pins. Of course the thus introduced stitches should get a color-code, see also #23 as foot-side stitches usually need twist-marks for consistent symmetry in the produced lace.
The templates are constructed by stitches carefully laid out on tiles that can be pieced together like a jig-saw. So far each tile was drawn by hand, a tedious an error prone task. The more sides on a tile, the more tiles are needed. That number becomes too big for interleaved patterns.
The theory to generate stitches on the tiles needs a translation into practice.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.