WO2015022683A1 - A method for creating a controlled and versatile connection between graphical objects - Google Patents

A method for creating a controlled and versatile connection between graphical objects Download PDF

Info

Publication number
WO2015022683A1
WO2015022683A1 PCT/IL2014/050715 IL2014050715W WO2015022683A1 WO 2015022683 A1 WO2015022683 A1 WO 2015022683A1 IL 2014050715 W IL2014050715 W IL 2014050715W WO 2015022683 A1 WO2015022683 A1 WO 2015022683A1
Authority
WO
WIPO (PCT)
Prior art keywords
skeleton
outline
nodes
smart
graphical objects
Prior art date
Application number
PCT/IL2014/050715
Other languages
French (fr)
Inventor
Ofir SHAVIT
Amichai KLEIN
Original Assignee
Fontark Ltd.
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Fontark Ltd. filed Critical Fontark Ltd.
Publication of WO2015022683A1 publication Critical patent/WO2015022683A1/en

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/60Editing figures and text; Combining figures or text
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/20Drawing from basic elements, e.g. lines or circles
    • G06T11/203Drawing of straight lines or curves
    • GPHYSICS
    • G09EDUCATION; CRYPTOGRAPHY; DISPLAY; ADVERTISING; SEALS
    • G09GARRANGEMENTS OR CIRCUITS FOR CONTROL OF INDICATING DEVICES USING STATIC MEANS TO PRESENT VARIABLE INFORMATION
    • G09G5/00Control arrangements or circuits for visual indicators common to cathode-ray tube indicators and other visual indicators
    • G09G5/22Control arrangements or circuits for visual indicators common to cathode-ray tube indicators and other visual indicators characterised by the display of characters or indicia using display control signals derived from coded signals representing the characters or indicia, e.g. with a character-code memory
    • G09G5/24Generation of individual character patterns
    • G09G5/246Generation of individual character patterns of ideographic or arabic-like characters

Definitions

  • the present invention relates to the field of computer graphics. More specifically, the present invention relates to creating a controlled and versatile connection between a plurality of graphical objects such as font characters or other graphical shapes.
  • Bitmap font is easy to use and provide a decent result of the font in low resolution.
  • the quality of the Bitmap font may be damaged when trying to enlarge and reduce automatically the font or the shape. This is a serious defect for many graphical applications such as maps or big scale signs as it does not let the option to zoom in or enlarge the font size without a significant loss of resolution that result with low quality imaging of the font.
  • Vector font In vector font, in contrast, the quality of the font is not defected with scale change.
  • Vector fonts uses geometrical vector primitives such as points, lines, curves, and shapes or polygon(s), which are all based on mathematical expressions, to represent images in computer graphics.
  • Vector graphics are based on vectors (also called paths, or strokes) which lead through locations called Nodes and control points. Each of these points has a definite position on the x and y axes of the work plan.
  • Each point, as well, is a variety of database, including the location of the point in the work space and the direction of the vector (which is what defines the direction of the track).
  • a vector font is consisted of a plurality of different shapes (over 50). Each shape is made of a complex outline, often with parallel curves or more complex graphic characteristics. Each shape has some unique characteristics and some common characteristics. The shapes are independent and being drawn manually by the designer one by one. This is a Sisyphean task that only few designers are capable of doing. There are several existing methods and techniques to ease and simplify the design and creation of a shape. One example is generating an outline from a stroke (as shown in Figs 1A-1D below). But there aren't any good tools for synchronizing letters or a plurality of different shapes.
  • Figs. 1A-1D schematically show an exemplar ⁇ ' of the method of the prior art to generate an outline from a stroke.
  • the designer draws a path 100 of an R - like shape.
  • special points called Nodes 101 - 105, and each node has handles 106— 111 which are used to manage the strength of the curve.
  • the path's stroke width 100 is increased to a desired width, while the nodes 101— 105 are still marked.
  • the edges of the path's stroke are traced to generate a new path on the outer lines of the width of the object to generate an outline from the path 100 and in Fig.
  • Fig. IE schematically shows an example of scaling outline according to the method of the prior art described above.
  • US 4,897,638 describes a method to reduce the font's saved data i.e. instead of saving the whole outline's data, the method analyzes the outline and defines a center line and extra specific marks about the width of the original shape.
  • the new data is shorter than the original shape's outline data, and when the shape needs to be displayed from the data, the invention's engine reconstruct the original Outline for display. This solution is good for compressing data and for display purposes but is has no practical use for design purposes
  • the present invention relates to a method for creating a controllable and versatile connection between graphical objects, comprising the steps of: drawing a path for determining a skeleton of each graphical object; applying an outline generator algorithm on said path for automatically generating an outline to each of said skeleton, wherein said skeleton includes control nodes so that said outline is controlled by said skeleton and wherein the nodes of said skeleton are correlated with the nodes of the outline; connecting selected control nodes of each skeleton of said graphical objects to a system of smart points that enable synchronization between a plurality of different shapes; and selecting one or more graphical objects to perform a synchronized change in the form of said selected graphical objects, thereby allowing to perform relative synchronized change, among said selected graphical objects.
  • creating the outline of a graphical object comprise the steps of: generating said outline relatively to the position of the control nodes on the skeleton; and changing said outline according to the change of the control nodes on said skeleton.
  • controlling the outline with the skeleton is done by moving the control nodes perpendicular to the skeleton or by moving said control nodes creating an angle with the tangent to the skeleton symmetrically or asymmetrically.
  • controlling the outline with the skeleton is done by creating a symmetrical outline where the width is identical in both sides of the skeleton or by creating a positive symmetrical outline where the right side or the top of the skeleton is broader or creating a negative symmetrical outline where the left side or the bottom of the skeleton is broader.
  • controlling the outline with the skeleton is done by creating a symmetrical or asymmetrical outline where the width of the outline is controlled and changed along the skeleton.
  • controlling the outline with the skeleton is done by handles of the nodes of the skeleton, wherein moving the handles is synchronized with the parallel handles on the outline, directly or relatively.
  • controlling the outline with the skeleton is done by creating more nodes on the outline which creates new nodes on the skeleton.
  • controlling the outline with the skeleton is done by deleting nodes in the skeleton or the outline, which deletes nodes on the outline or skeleton respectively.
  • controlling the outline with the skeleton is done by moving the skeleton's nodes.
  • controlling the outline with the skeleton is done by moving a node on the outline so that the corresponding point on the skeleton can move the parallel node in the second side of the outline accordingly.
  • the Smart Points system synchronize paths (Skeletons) of different graphical objects.
  • moving one or more smart points in one graphical object changes the nodes of all the selected graphical objects which are connected to the same smart point in each of the different graphical objects.
  • adding or removing nodes in a subpath between smart points of a first graphical object adds or removes nodes in the subpath of all the graphical objects which are connected to the same smart point in each of the different graphical objects.
  • a subpath between smart points in a first graphical object is updated with appropriate adaptations when modified in other selected graphical objects in which a corresponding smart point is located in a different location.
  • FIG. 1A-1D schematically show a method of generating an outline from a stroke according to the prior art
  • Figs. IE shows a scaling of the outline according to the prior art
  • Fig. IF shows a scaling of the outline according to an embodiment of the invention
  • Figs. 2 - 4 schematically shows an example for creating an outline from a skeleton according to an embodiment of the invention
  • Figs 5— 7 schematically shows another example for creating an outline from a skeleton according to an embodiment of the invention
  • Fig. 8 schematically show an example of a final outline generated from a skeleton according to an embodiment of the invention
  • Figs. 9A-9B schematically show a modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention
  • Fig. 10 schematically show another modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention
  • Fig. 11 schematically show a modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention
  • Fig. 12A (image is cutted) schematically shows a spread of smart points in the work space according to an embodiment of the invention
  • Fig. 12B schematically shows a system of smart points with path nodes connected to the smart points according to an embodiment of the invention
  • Fig. 13A schematically shows a system of smart points with a plurality of paths nodes connected according to an embodiment of the invention
  • Fig. 13B schematically shows a modification of selected paths of a plurality of paths connected to a system of smart points according to an embodiment of the invention
  • Fig. 13C schematically shows another modification of selected paths of a plurality of paths connected to a system of smart points according to an embodiment of the invention
  • Fig. 14 schematically shows example of the table of a database according to an embodiment of the invention.
  • Fig. 15 schematically shows an example of the table of a database after connecting points to smart points according to an embodiment of the invention
  • Fig. 16 schematically shows another example of a table of the database after connecting points to smart points according to an embodiment of the invention
  • Fig. 17 schematically shows the method of creating a skeleton of a graphical object according to an embodiment of the invention
  • Fig. 18 schematically shows the method of connecting between graphical objects according to an embodiment of the invention
  • Figs. 19A-19B schematically show an outline which is controlled and changed symmetrically and asymmetrically along the skeleton.
  • the present invention relates to a graphic vectors method for designing graphical objects, wherein a skeleton of a graphical object is first created so that it saves the need to draw the outlines of the character and wherein a system with smart points is created and which enables to change and modify a group of graphical object's Skeletons by changing or editing only one Skeleton from the group.
  • the outline path contains nodes and control points which use to edit and change the design of the character.
  • the outline is created according to the need of creating lines which may be parallel or "symmetric mirror" such that the relation between the different sides of the outline defines the shape and the visual characteristic of the object and the width of the object.
  • the designer first draws a skeleton which is an editable center line of a graphical object that saves the need of drawing the basic letter outlines.
  • the present invention automatically generates the outline of the graphical object.
  • the present invention generates the outline according to and in relation with the location of the nodes on the skeleton of the graphical object and it changes the outline with respect to the changes of the nodes on the skeleton so that the outline is updated immediately when the skeleton changes.
  • the number of control nodes generated by the method of the invention is relatively small and therefor easier to control (as there are less control nodes to change when a modification in the design is necessary).
  • the advantage of the method of the present invention is the direct relation between the position of the nodes on the outline and equivalent nodes on the skeleton, as it provides the designer a tool to easily control the width of the outline and the general design and the changes in the design of the object without the need to change the outline separately from the skeleton.
  • Fig. 17 schematically shows the method of creating the skeleton with the controlled outline.
  • the user draws a path.
  • the outline is automatically generated surrounding the drawn path (The Skeleton) by the outline generator.
  • the skeleton controls the outline.
  • the following section describes an algorithm to generate an Outline from a skeleton.
  • a skeleton represented as SVG path is used, wherein the input is the coordinates of points and the operations that are operated between said points,
  • the algorithm description fits to cubic (with four points) and quadratic (with three points) Bezier curves used in fonts but can be adapted to other Bezier curves.
  • the path is displayed as a set of one straight line (two points) and two cubic curves (3*2 points). A total of 8 points 201 - 208 is received as can be seen in Fig. 2.
  • the outline is automatically generated by the present invention according to a width input that the user gives.
  • the method for generating the outline comprises the following steps:
  • Figs 5— 8 schematically show an example for the generation of the outline of the R-like shape.
  • the path 500 contains five nodes 501-505 and six handles 511— 516.
  • a linear line 610 which connects between all the nodes and control points of the skeleton's path 500 (the outline's root base) is generated.
  • the generation of the outline according to a received input of the width - x of the R-like shape is shown in Fig. 7.
  • the width of the R-like shape is x so that the distance of each side line from the skeleton's path's edge is x/2.
  • Fig. 8 shows the final outline 810 which contains the same amount of nodes and control points on both sides of the skeleton 805 while the Skeleton's path remains and enables control and unlimited further changes that influences the shape's outline.
  • Fig. IF schematically shows a scaling of the outline with the skeleton. It can be seen that the shape is scaled without smearing.
  • the Skeleton enables changing the width X (weight) of the graphical object with a slider input controlled by the designer, which changes the width X to any desired size and make the shape wider or thinner in relation to the Skeleton's path while maintaining resemblance to the skeleton.
  • modifying the Skeleton's segments can change the outline's related segments.
  • Fig. 11 shows a change from curve to straight in the skeleton's segments 1101 and 1102. The change is automatically updated in the outline so that the outline is synchronized with the skeleton.
  • a node in any direction changes the corresponding nodes on the outline so that the outline is synchronized with the skeleton.
  • the movement of the node can be perpendicular to the skeleton or creating an angle with the tangent to the skeleton (i.e. in the same direction or in opposite directions) symmetrically or asymmetrically.
  • An alternative way of controlling the outline by the skeleton is by using the handles 915 and 916 of the nodes of the skeleton 905, wherein the movement of the handles is synchronized with the parallel handles 925, 926, 935, 936 of nodes on the outline 910, directly or relatively as shown in Fig. 9A and 9B.
  • Fig. 9A Handles 915 and 916 are moved and then in Fig. 9B it is shown that the skeleton 905 and the outline 910 are synchronized so that the movement in the skeleton is automatically updated in the outline.
  • controlling the outline with the skeleton can also be done by creating more nodes on the skeleton (or on the outline).
  • Fig. 10 shows a new node 1001 that is added to the skeleton and equivalent nodes 1002 and 1003 are automatically added on the outline.
  • a change in the outline can be updated automatically in the skeleton.
  • the movement of a node on the outline can move the corresponding point on the skeleton and the parallel node in the second side of the outline accordingly.
  • a positive symmetrical outline can be created where the right side or the top of the skeleton is broader or a negative symmetrical outline can be created where the left side or the bottom of the skeleton is broader.
  • the outline can be controlled and changes by the skeleton symmetrically and asymmetrically along the skeleton.
  • Figs. 19A schematically show an outline 1910 which is controlled and changed along skeleton 1905 symmetrically
  • Fig. 19B schematically show an outline 1911 which is controlled and changed along skeleton 1905 asymmetrically.
  • the outline may be a curve or straight. The control on the parameters of the outline is made by input which is given by the user.
  • each skeleton of each shape is connected to a system which contains smart points.
  • Smart points are a set of special points which appears in a workspace which is common to all graphical objects.
  • a node of a skeleton of a graphical object can be connected to a system of smart points so that said system enables real time connection between all graphical objects, in a manner that a movement of a smart point in one graphical object changes simultaneously the nodes of all the selected graphical objects which are connected to the same smart point in each of the different objects.
  • a skeleton can be connected to the system of smart points by connecting one node, all the nodes or just a selected number of nodes (each node can be connected to the smart points but does not have to be).
  • the system of smart points of the invention enables to connect between all the font's letters, characters and shapes and changing them accordingly.
  • Fig. 12A schematically shows an example of a system of smart points.
  • Fig. 18 schematically shows the method of connecting between graphical objects according to an embodiment of the invention.
  • step 1801 the skeleton paths of a plurality of separated shapes is connected to the smart points system.
  • step 1802 one or more graphical objects are selected to perform a synchronized change; and finally in step 1803, performing relative synchronized change, among said selected shapes.
  • Fig. 12A shows an example of a smart points system 1300 in a matrix array.
  • the smart points are located in a general workspace, which is common to all the shapes.
  • the smart points can be placed on an arranged grid or randomly, and new smart points can be added to the plane or removed from the plane at any time.
  • the user can move every smart point independently, changing one node in one shape only or the user can move a smart point in a collective way so that all the nodes of all the selected shapes that are connected to said smart point, are changed accordingly. This way while editing one character, the user actually edits all the rest of the selected font's characters as well.
  • the nodes of the skeleton can be connected to the smart points so that the movement of a smart point in the plane/space will move all the nodes in said plane/space of all the shapes connected without affecting the location of the other nodes on the skeleton in the plane/space. It is possible to connect to each smart point more than one Node in a way that when a Smart point moves all the connected nodes will move with the Smart point (if selected)
  • Fig. 12B it can be seen the smart points system 1200 with a skeleton 1210 that contains six nodes 1201 - 1206, wherein nodes 1201, 1202, 1203, 1205 and 1206 are connected to the smart points 1211 - 1215 while node 1204 is not connected.
  • Fig. 13A shows the letters in the following group of letters: E— 1320, F— 1321, L - 1322, K - 1323 and P - 1324, all have nodes which are connected to the same smart points 1350 and 1360.
  • E— 1320 F— 1321, L - 1322, K - 1323 and P - 1324
  • all have nodes which are connected to the same smart points 1350 and 1360.
  • the letters that are selected F - 1321, K - 1323 and P— 1324 are also modified by the movement of the smart point 1350 so that the modification is updated in said selected letters.
  • the user selects the graphical object (i.e. shapes or letters) that have to be changed (one or more or even all the graphical objects can be selected), and then performs the change in one graphical object so that a relative synchronized change is performed among all the selected graphical objects.
  • the graphical object i.e. shapes or letters
  • the change in one graphical object so that a relative synchronized change is performed among all the selected graphical objects.
  • the smart points control each segment of the skeleton which connects between two smart points as follows: if in two shapes or more there is a segment which connects between the same smart points, the whole segment between said two smart points, changes in a synchronized way in all the shapes that the user selects and chosen to be changed.
  • segment refers to a subpath that connects between two smart points.
  • Fig. 13A shows a segment in the letter E-1320, which connects between smart points 1350 and 1352.
  • Smart point 1351 which is located in the path between smart points 1350 and 1352 is not connected as can easily be seen in the Fig.
  • Fig 13A it can be seen that all the letters E - 1320, F - 1321, L - 1322, K— 1323 and P - 1324, have a segment in their skeleton which is connected between the same smart points 1350 and 1360. Although the segment crosses smart point 1355, the smart point 1355 is not connected.
  • Fig. 13C a modification of the letter E - 1320 is done by changing the segment which connects between the smart points 1350 and 1360. The same modification is applied to the selected letters which have segment in their skeleton which connects between the same smart points 1350 and 1360. In this case the selected letters that are changed are: F-1321, L- 1322 and P-1324.
  • the modification of the segment can be by changing the segment from a straight to a curve (as shown in Fig. 13C) or from a curve to a straight or by moving the segment or any other change.
  • An additional change can be made by adding a new node (or several nodes) to the skeleton as shown in Fig. 13C, where a node 1390 is added to the letter E - 1320 and automatically added to the selected letters F-1321, L-1322 and P-1324 accordingly.
  • any subpath connected by the same two smart points, at any character, shape or letter, can be edited and changed at once by the present invention.
  • smart segments describes the method of detecting which smart segment has been changed in a graphical object and describe the algorithm to copy, with appropriate adaptations, the sub -path in that smart segment to the same segment in different letters/shapes.
  • a “Smart Segment” is a set of zeros and ones (i.e. 0, 1) or many elements from the following types: point, control point, line, curve, sub-path or a path. Smart segment can be a full path or a sub-path (one or many path segments). A “Smart Segment” starts and finishes with a point or a control point which is defined as a "Smart Point”.
  • the database contains records for each smart point and contains the relevant data to detect the segment and point where the smart point is connected to.
  • Each record contains the Smart Point identifier, The segment index (from the start of the skeleton) and the point's index inside the segment. Other data can be attached to each record.
  • Fig. 14 shows an example of the table of the database.
  • the user connects the following points (nodes) to smart points as follows:
  • the database records will be as shown in the table in Fig. 15.
  • the Algorithm to match similar Smart Segments in different shapes is based on the SmartPoint Identifiers / INDEX or BOTHs. Once a change is done in the first shape (e.g. insert new node, remove node/s, change node position, change segment type from line to curve etc..) the algorithm compares the new path to the previous one before the change was applied and looks for the segment/s which was changed.
  • a change e.g. insert new node, remove node/s, change node position, change segment type from line to curve etc..
  • MSI Modified Segment Id
  • the algorithm loops over the Smart Segment database and looks for a record where segment Index is equal to MSI. If there is a match, it saves the "Smart Point Identifier” as “Smart Segment Start Point” (SSSP). Otherwise it loops on the table looking for a segment index equal to MSI minus one. It continues looping and searching for the previous index etc, until the SSSP is detected or the index will be less than zero.
  • Smart Segment End Point It loops over the table and looks for a segment index equal to MSI+1. If a match is founded, it will save the "Smart Point Identifier" as SSEP. Otherwise loop with the next index - till a match is found or it reaches the end of the path.
  • pair of (SSSP,SSEP) is equivalent to the pair (SSEP,SSSP) since the path direction is not matter when detecting Smart Segments.
  • SSSubPath For each Smart Segment its Sub-path (SSSubPath) can be defined as a set of path's segments from SSSP to SSEP.
  • This sub-path can be represented as a graphic object using any vector image format (e.g. SVG).
  • the other shape which has a similar database may have a similar Smart Point Identifiers / Smart Point indexes.
  • the algorithm loops on records in DB2 and looks for Smart Points with similar ID/Index to SSSP and SSEP.
  • the algorithm looks if there is at least one record R in DB2 which the segment index is between those numbers (sl ⁇ R.SegemntIdx ⁇ S2) If such record exists the algorithm continues the search for smart segment— and continues to look if there are other pairs of records where SSSP and SSEP exists. If there are no such pairs it moves to the next shape/path.
  • An example for an implementation of a different algorithm to detect the smart segment on the second shape can be as follows:
  • SSSP Smart Point Identifiers founded in the Original shape's database.
  • ⁇ //segment is not attached to any SX.
  • the shape's database After applying the changes to the new shape the shape's database has to be modified to reflect the changes in segments and nodes/points.
  • a transformation of sub-path on 2 dimension surface is done with a combination of the following Vector Graphics commands: Transfer, Rotate, Scale.
  • the parameters for each command are derived from the Smart Points' position in the surface.
  • d3 (SSEPl.y - SSSPl.y); //Distance on Y between original SS's points.
  • ango calcAngle(SSSPl.x, SSSPl.y, SSEPl.x, SSEPl.y);
  • angT calcAngle(SSSP2.x, SSSP2.y, SSEP2.X, SSEP2.y);
  • Tx SSSP2.X - SSSPl.x
  • Ty SSSP2.y - SSSPl.y;
  • Rtt angT - angO

Landscapes

  • Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Theoretical Computer Science (AREA)
  • Computer Hardware Design (AREA)
  • Processing Or Creating Images (AREA)

Abstract

The present invention relates to a method for creating a controllable and versatile connection between graphical objects, comprising the steps of: drawing a path for determining a skeleton of each graphical object; applying an outline generator algorithm on said path for automatically generating an outline to each of said skeleton, wherein said skeleton includes control nodes so that said outline is controlled by said skeleton and wherein the nodes of said skeleton are correlated with the nodes of the outline; connecting selected control nodes of each skeleton of said graphical objects to a system of smart points that enable synchronization between a plurality of different shapes; and selecting one or more graphical objects to perform a synchronized change in the form of said selected graphical objects, thereby allowing to perform relative synchronized change, among said selected graphical objects.

Description

A METHOD FOR CREATING A CONTROLLED AND VERSATILE CONNECTION BETWEEN GRAPHICAL OBJECTS
Field of Invention
The present invention relates to the field of computer graphics. More specifically, the present invention relates to creating a controlled and versatile connection between a plurality of graphical objects such as font characters or other graphical shapes.
Background of the Invention
There are two main methods for designing computerized fonts, the first is Bitmap font and the second is vector font. Bitmap font is easy to use and provide a decent result of the font in low resolution. However, the quality of the Bitmap font may be damaged when trying to enlarge and reduce automatically the font or the shape. This is a serious defect for many graphical applications such as maps or big scale signs as it does not let the option to zoom in or enlarge the font size without a significant loss of resolution that result with low quality imaging of the font.
In vector font, in contrast, the quality of the font is not defected with scale change. Vector fonts uses geometrical vector primitives such as points, lines, curves, and shapes or polygon(s), which are all based on mathematical expressions, to represent images in computer graphics. Vector graphics are based on vectors (also called paths, or strokes) which lead through locations called Nodes and control points. Each of these points has a definite position on the x and y axes of the work plan. Each point, as well, is a variety of database, including the location of the point in the work space and the direction of the vector (which is what defines the direction of the track). This Mathematical way of storing graphic data enables a small amount of data (in comparison to bitmap) to describe a defined graphical shape and it allows Scalability - Vector graphics can be scaled infinitely without loss of visual quality while not affecting the size of the files in a substantial way because all the information that describes how to draw the vector resides in the structure.
Since text is usually made of defined shapes and being applied in various sizes and mediums, the characteristics of vector graphics is an ideal technology for the majority of text applications, and therefore it is most common in text usages.
However creating and/or modifying a vector font is not a simple task.
A vector font is consisted of a plurality of different shapes (over 50). Each shape is made of a complex outline, often with parallel curves or more complex graphic characteristics. Each shape has some unique characteristics and some common characteristics. The shapes are independent and being drawn manually by the designer one by one. This is a Sisyphean task that only few designers are capable of doing. There are several existing methods and techniques to ease and simplify the design and creation of a shape. One example is generating an outline from a stroke (as shown in Figs 1A-1D below). But there aren't any good tools for synchronizing letters or a plurality of different shapes.
Figs. 1A-1D schematically show an exemplar}' of the method of the prior art to generate an outline from a stroke. In the first step, the designer draws a path 100 of an R - like shape. On the path 100 are marked special points called Nodes 101 - 105, and each node has handles 106— 111 which are used to manage the strength of the curve. In the second step the path's stroke width 100 is increased to a desired width, while the nodes 101— 105 are still marked. In the third step the edges of the path's stroke are traced to generate a new path on the outer lines of the width of the object to generate an outline from the path 100 and in Fig. ID the final result is received as the outline of the R - like shape, with many uncorrelated nodes 121-145 with no connection to the original nodes 101-105, while the original path stroke is deleted and the Outline is the new path, so that if there is a change in the design of the R - like shape it has to be made on each line of the outline separately. Fig. IE schematically shows an example of scaling outline according to the method of the prior art described above.
US 4,897,638 describes a method to reduce the font's saved data i.e. instead of saving the whole outline's data, the method analyzes the outline and defines a center line and extra specific marks about the width of the original shape. The new data is shorter than the original shape's outline data, and when the shape needs to be displayed from the data, the invention's engine reconstruct the original Outline for display. This solution is good for compressing data and for display purposes but is has no practical use for design purposes
It is therefore an object of the present invention to provide a method for creating a connection between graphical objects which enables to design and edit different and separated graphical objects as a whole and individually, while keeping each graphical object's uniqueness.
It is another object of the present invention to provide a method for generating an outline of a graphical object so that the outline can be easily controlled and modified.
Further purposes and advantages of this invention will appear as the description proceeds. Summary of the Invention
The present invention relates to a method for creating a controllable and versatile connection between graphical objects, comprising the steps of: drawing a path for determining a skeleton of each graphical object; applying an outline generator algorithm on said path for automatically generating an outline to each of said skeleton, wherein said skeleton includes control nodes so that said outline is controlled by said skeleton and wherein the nodes of said skeleton are correlated with the nodes of the outline; connecting selected control nodes of each skeleton of said graphical objects to a system of smart points that enable synchronization between a plurality of different shapes; and selecting one or more graphical objects to perform a synchronized change in the form of said selected graphical objects, thereby allowing to perform relative synchronized change, among said selected graphical objects.
In an embodiment of the invention creating the outline of a graphical object comprise the steps of: generating said outline relatively to the position of the control nodes on the skeleton; and changing said outline according to the change of the control nodes on said skeleton.
In an embodiment of the invention controlling the outline with the skeleton is done by moving the control nodes perpendicular to the skeleton or by moving said control nodes creating an angle with the tangent to the skeleton symmetrically or asymmetrically.
In an embodiment of the invention controlling the outline with the skeleton is done by creating a symmetrical outline where the width is identical in both sides of the skeleton or by creating a positive symmetrical outline where the right side or the top of the skeleton is broader or creating a negative symmetrical outline where the left side or the bottom of the skeleton is broader.
In an embodiment of the invention controlling the outline with the skeleton is done by creating a symmetrical or asymmetrical outline where the width of the outline is controlled and changed along the skeleton.
In an embodiment of the invention controlling the outline with the skeleton is done by handles of the nodes of the skeleton, wherein moving the handles is synchronized with the parallel handles on the outline, directly or relatively.
In an embodiment of the invention wherein controlling the outline with the skeleton is done by creating more nodes on the skeleton which creates new nodes on the outline
In an embodiment of the invention controlling the outline with the skeleton is done by creating more nodes on the outline which creates new nodes on the skeleton.
In an embodiment of the invention controlling the outline with the skeleton is done by deleting nodes in the skeleton or the outline, which deletes nodes on the outline or skeleton respectively.
In an embodiment of the invention controlling the outline with the skeleton is done by moving the skeleton's nodes.
In an embodiment of the invention controlling the outline with the skeleton is done by moving a node on the outline so that the corresponding point on the skeleton can move the parallel node in the second side of the outline accordingly. In an embodiment of the invention the Smart Points system synchronize paths (Skeletons) of different graphical objects.
In an embodiment of the invention moving one or more smart points in one graphical object, changes the nodes of all the selected graphical objects which are connected to the same smart point in each of the different graphical objects.
In an embodiment of the invention adding or removing nodes in a subpath between smart points of a first graphical object adds or removes nodes in the subpath of all the graphical objects which are connected to the same smart point in each of the different graphical objects.
In an embodiment of the invention a subpath between smart points in a first graphical object is updated with appropriate adaptations when modified in other selected graphical objects in which a corresponding smart point is located in a different location.
All the above and other characteristics and advantages of the invention will be further understood through the following illustrative and non- limitative description of embodiments thereof, with reference to the appended drawings. In the drawings the same numerals are sometimes used to indicate the same elements in different drawings.
Brief Description of the Drawings
Fig. 1A-1D schematically show a method of generating an outline from a stroke according to the prior art;
Figs. IE shows a scaling of the outline according to the prior art; Fig. IF shows a scaling of the outline according to an embodiment of the invention;
Figs. 2 - 4 schematically shows an example for creating an outline from a skeleton according to an embodiment of the invention;
Figs 5— 7 schematically shows another example for creating an outline from a skeleton according to an embodiment of the invention;
Fig. 8 schematically show an example of a final outline generated from a skeleton according to an embodiment of the invention;
Figs. 9A-9B schematically show a modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention;
Fig. 10 schematically show another modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention;
Fig. 11 schematically show a modification of the skeleton and the automatic update of the Outline according to an embodiment of the invention;
Fig. 12A(image is cutted) schematically shows a spread of smart points in the work space according to an embodiment of the invention;
Fig. 12B schematically shows a system of smart points with path nodes connected to the smart points according to an embodiment of the invention;
Fig. 13A schematically shows a system of smart points with a plurality of paths nodes connected according to an embodiment of the invention;
Fig. 13B schematically shows a modification of selected paths of a plurality of paths connected to a system of smart points according to an embodiment of the invention; Fig. 13C schematically shows another modification of selected paths of a plurality of paths connected to a system of smart points according to an embodiment of the invention;
Fig. 14 schematically shows example of the table of a database according to an embodiment of the invention;
Fig. 15 schematically shows an example of the table of a database after connecting points to smart points according to an embodiment of the invention;
Fig. 16 schematically shows another example of a table of the database after connecting points to smart points according to an embodiment of the invention;
Fig. 17 schematically shows the method of creating a skeleton of a graphical object according to an embodiment of the invention;
Fig. 18 schematically shows the method of connecting between graphical objects according to an embodiment of the invention; and Figs. 19A-19B schematically show an outline which is controlled and changed symmetrically and asymmetrically along the skeleton.
Detailed Description of the Embodiment of the Invention
The present invention relates to a graphic vectors method for designing graphical objects, wherein a skeleton of a graphical object is first created so that it saves the need to draw the outlines of the character and wherein a system with smart points is created and which enables to change and modify a group of graphical object's Skeletons by changing or editing only one Skeleton from the group.
Usually, in font design the designer draws the outline of each letter with closed Bezier curve, lines or other mathematical formula. The outline path contains nodes and control points which use to edit and change the design of the character. The outline is created according to the need of creating lines which may be parallel or "symmetric mirror" such that the relation between the different sides of the outline defines the shape and the visual characteristic of the object and the width of the object.
In one embodiment of the present invention, the designer first draws a skeleton which is an editable center line of a graphical object that saves the need of drawing the basic letter outlines. After the user draws the skeleton of a graphical object, the present invention automatically generates the outline of the graphical object. The present invention generates the outline according to and in relation with the location of the nodes on the skeleton of the graphical object and it changes the outline with respect to the changes of the nodes on the skeleton so that the outline is updated immediately when the skeleton changes. Also, the number of control nodes generated by the method of the invention is relatively small and therefor easier to control (as there are less control nodes to change when a modification in the design is necessary). The advantage of the method of the present invention is the direct relation between the position of the nodes on the outline and equivalent nodes on the skeleton, as it provides the designer a tool to easily control the width of the outline and the general design and the changes in the design of the object without the need to change the outline separately from the skeleton.
Fig. 17 schematically shows the method of creating the skeleton with the controlled outline. In the first step 1, the user draws a path. In the second step 2, the outline is automatically generated surrounding the drawn path (The Skeleton) by the outline generator. In the third step 3, the skeleton controls the outline. The following section describes an algorithm to generate an Outline from a skeleton. For simplicity a skeleton represented as SVG path is used, wherein the input is the coordinates of points and the operations that are operated between said points, The algorithm description fits to cubic (with four points) and quadratic (with three points) Bezier curves used in fonts but can be adapted to other Bezier curves.
Assuming the input for the skeleton path is:
M177, 155L279, 155C321, 125 406, 241 484, 1720548, 102 673, 105 674, 167
The path is displayed as a set of one straight line (two points) and two cubic curves (3*2 points). A total of 8 points 201 - 208 is received as can be seen in Fig. 2. After the basic path is generated, the outline is automatically generated by the present invention according to a width input that the user gives.
The method for generating the outline comprises the following steps:
1. Create a list of all points ("Points List") and keep the order of the points.
For example in Fig 2, the samples of the points are:
(177, 155 ) (279, 155 ) ( 321, 125) (406, 241) (484, 172) (548, 102) (673, 105 ) (674, 167)
2. Create a linear line 301 from one point to the next point in the array, so that the line connects all the points as can be seen in Fig. 3.
3. For each two points in the Points List (i.e. for each segment in line 301), find a new parallel line which is distance ("offset") from Line 301 is exactly W. A set of lines 401 - 406 is received, as shown in Fig. 4 (A Parallel line is calculated using perpendicular for each pair of points resulting with new pair of points. The Parallel line is the linear line between those new points).
4. Calculate the first point which is on the line with an offset of W to the first point in "Point List". 5. Create a list of all interception points of the lines from previous step 4. ("New Position List"). Add that list to the point calculated in step 4.
6. Add to the end of the list a new point which is the offset of W from the last point in "Point List".
7. Run over the original path and replace the points' coordinates with the appropriate coordinates from 'New Position List', (i.e. the first point in the path is replaced by the first element in 'New Position List', the second point with the second element in 'New Position List' etc.). The result is a new path "Right Path" 420.
8. Create a reverse list of the array founded in step 1.
9. Repeat steps 2-7 and get a new path "Left path" 410.
10. Connect "Right Path" 420 and "Left Path" 410 with direct lines or "Caps" 415 and 416. If the skeleton path is a "closed path", no cap is required.
11. The result is the full outline.
Figs 5— 8 schematically show an example for the generation of the outline of the R-like shape. In Figs 5A - 5B the basic path 500 of the R-like shape which is the skeleton's path is shown. The path 500 contains five nodes 501-505 and six handles 511— 516. In Fig. 6 a linear line 610 which connects between all the nodes and control points of the skeleton's path 500 (the outline's root base) is generated. The generation of the outline according to a received input of the width - x of the R-like shape is shown in Fig. 7. The width of the R-like shape is x so that the distance of each side line from the skeleton's path's edge is x/2. Fig. 8 shows the final outline 810 which contains the same amount of nodes and control points on both sides of the skeleton 805 while the Skeleton's path remains and enables control and unlimited further changes that influences the shape's outline.
Fig. IF schematically shows a scaling of the outline with the skeleton. It can be seen that the shape is scaled without smearing.
In the present invention there are several ways to control the outline by the skeleton:
In the first way, the Skeleton enables changing the width X (weight) of the graphical object with a slider input controlled by the designer, which changes the width X to any desired size and make the shape wider or thinner in relation to the Skeleton's path while maintaining resemblance to the skeleton.
In the second way, modifying the Skeleton's segments can change the outline's related segments. Fig. 11 shows a change from curve to straight in the skeleton's segments 1101 and 1102. The change is automatically updated in the outline so that the outline is synchronized with the skeleton.
In the third way, moving a node in any direction, changes the corresponding nodes on the outline so that the outline is synchronized with the skeleton. The movement of the node can be perpendicular to the skeleton or creating an angle with the tangent to the skeleton (i.e. in the same direction or in opposite directions) symmetrically or asymmetrically. An alternative way of controlling the outline by the skeleton is by using the handles 915 and 916 of the nodes of the skeleton 905, wherein the movement of the handles is synchronized with the parallel handles 925, 926, 935, 936 of nodes on the outline 910, directly or relatively as shown in Fig. 9A and 9B. In Fig. 9A Handles 915 and 916 are moved and then in Fig. 9B it is shown that the skeleton 905 and the outline 910 are synchronized so that the movement in the skeleton is automatically updated in the outline.
In the fourth way, controlling the outline with the skeleton can also be done by creating more nodes on the skeleton (or on the outline). Fig. 10 shows a new node 1001 that is added to the skeleton and equivalent nodes 1002 and 1003 are automatically added on the outline. In an embodiment of the invention, also a change in the outline can be updated automatically in the skeleton. The movement of a node on the outline can move the corresponding point on the skeleton and the parallel node in the second side of the outline accordingly. Also, in the present invention it is possible to create a symmetrical outline where the width of the outline is identical in both sides of the skeleton. Similarly, a positive symmetrical outline can be created where the right side or the top of the skeleton is broader or a negative symmetrical outline can be created where the left side or the bottom of the skeleton is broader.
In an embodiment of the invention, the outline can be controlled and changes by the skeleton symmetrically and asymmetrically along the skeleton. Figs. 19A schematically show an outline 1910 which is controlled and changed along skeleton 1905 symmetrically, and Fig. 19B schematically show an outline 1911 which is controlled and changed along skeleton 1905 asymmetrically. It should be noticed that the outline may be a curve or straight. The control on the parameters of the outline is made by input which is given by the user.
In another embodiment of the present invention, after the designer/user draws the shapes using the skeleton method, each skeleton of each shape is connected to a system which contains smart points. Smart points are a set of special points which appears in a workspace which is common to all graphical objects. A node of a skeleton of a graphical object can be connected to a system of smart points so that said system enables real time connection between all graphical objects, in a manner that a movement of a smart point in one graphical object changes simultaneously the nodes of all the selected graphical objects which are connected to the same smart point in each of the different objects. A skeleton can be connected to the system of smart points by connecting one node, all the nodes or just a selected number of nodes (each node can be connected to the smart points but does not have to be). For example: in the design of a font, the system of smart points of the invention enables to connect between all the font's letters, characters and shapes and changing them accordingly. Fig. 12A schematically shows an example of a system of smart points.
Fig. 18 schematically shows the method of connecting between graphical objects according to an embodiment of the invention. In step 1801 the skeleton paths of a plurality of separated shapes is connected to the smart points system. In step 1802, one or more graphical objects are selected to perform a synchronized change; and finally in step 1803, performing relative synchronized change, among said selected shapes.
Fig. 12A shows an example of a smart points system 1300 in a matrix array. The smart points are located in a general workspace, which is common to all the shapes. The smart points can be placed on an arranged grid or randomly, and new smart points can be added to the plane or removed from the plane at any time. The user can move every smart point independently, changing one node in one shape only or the user can move a smart point in a collective way so that all the nodes of all the selected shapes that are connected to said smart point, are changed accordingly. This way while editing one character, the user actually edits all the rest of the selected font's characters as well. It should be noted that the nodes of the skeleton can be connected to the smart points so that the movement of a smart point in the plane/space will move all the nodes in said plane/space of all the shapes connected without affecting the location of the other nodes on the skeleton in the plane/space. It is possible to connect to each smart point more than one Node in a way that when a Smart point moves all the connected nodes will move with the Smart point (if selected)
In Fig. 12B it can be seen the smart points system 1200 with a skeleton 1210 that contains six nodes 1201 - 1206, wherein nodes 1201, 1202, 1203, 1205 and 1206 are connected to the smart points 1211 - 1215 while node 1204 is not connected.
Fig. 13A shows the letters in the following group of letters: E— 1320, F— 1321, L - 1322, K - 1323 and P - 1324, all have nodes which are connected to the same smart points 1350 and 1360. When modifying one letter of said group, for example the letter E - 1320, by moving smart point 1350 as can be seen in Fig. 13B, the letters that are selected F - 1321, K - 1323 and P— 1324 are also modified by the movement of the smart point 1350 so that the modification is updated in said selected letters.
It should be noted that even when the location of the smart points in the plane/space is not identical - an adjustment is made considering the distance and angles between the smart points using mathematical operations such as transferring, scaling, rotating etc.
Once the skeleton of the graphical object is connected to the smart points, the user selects the graphical object (i.e. shapes or letters) that have to be changed (one or more or even all the graphical objects can be selected), and then performs the change in one graphical object so that a relative synchronized change is performed among all the selected graphical objects.
In another embodiment of the invention, the smart points control each segment of the skeleton which connects between two smart points as follows: if in two shapes or more there is a segment which connects between the same smart points, the whole segment between said two smart points, changes in a synchronized way in all the shapes that the user selects and chosen to be changed.
The term segment refers to a subpath that connects between two smart points. For example, Fig. 13A shows a segment in the letter E-1320, which connects between smart points 1350 and 1352. Smart point 1351 which is located in the path between smart points 1350 and 1352 is not connected as can easily be seen in the Fig.
In Fig 13A it can be seen that all the letters E - 1320, F - 1321, L - 1322, K— 1323 and P - 1324, have a segment in their skeleton which is connected between the same smart points 1350 and 1360. Although the segment crosses smart point 1355, the smart point 1355 is not connected. In Fig. 13C a modification of the letter E - 1320 is done by changing the segment which connects between the smart points 1350 and 1360. The same modification is applied to the selected letters which have segment in their skeleton which connects between the same smart points 1350 and 1360. In this case the selected letters that are changed are: F-1321, L- 1322 and P-1324.
The modification of the segment can be by changing the segment from a straight to a curve (as shown in Fig. 13C) or from a curve to a straight or by moving the segment or any other change. An additional change can be made by adding a new node (or several nodes) to the skeleton as shown in Fig. 13C, where a node 1390 is added to the letter E - 1320 and automatically added to the selected letters F-1321, L-1322 and P-1324 accordingly.
It can be said that any subpath connected by the same two smart points, at any character, shape or letter, can be edited and changed at once by the present invention.
In the smart points system, also a subpath between two smart points can be copied with appropriate adaptations to other graphical objects.
The following sections define "smart segments", describes the method of detecting which smart segment has been changed in a graphical object and describe the algorithm to copy, with appropriate adaptations, the sub -path in that smart segment to the same segment in different letters/shapes.
A "Smart Segment" is a set of zeros and ones (i.e. 0, 1) or many elements from the following types: point, control point, line, curve, sub-path or a path. Smart segment can be a full path or a sub-path (one or many path segments). A "Smart Segment" starts and finishes with a point or a control point which is defined as a "Smart Point".
Once a shape or a path is drawn and Smart Points are attached/defined to that skeleton, a database describing the smart segment is generated.
The database contains records for each smart point and contains the relevant data to detect the segment and point where the smart point is connected to.
Each record contains the Smart Point identifier, The segment index (from the start of the skeleton) and the point's index inside the segment. Other data can be attached to each record. Fig. 14 shows an example of the table of the database.
The following sample use SVG format, but the algorithm can use any other vector image formats.
Assuming input! of the following shape is:
M177,155L279,155C321,125 406,241 484,172 C548,102 673,105 674,167 C348,102 373,105 374,167
The user connects the following points (nodes) to smart points as follows:
• Point (279,155) to SmartPointl
• Point (484,172) to SmartPoint2
• Point (374,167) to SmartPoint3
The database records will be as shown in the table in Fig. 15.
Assuming input2 of the following path is:
Μ10θ,10θ L179,155 C321,125 406,241 484,172 L200,300 L300,400 C548,102 673,105 674,167 C348,102 373,105 374,167
User attached the following points to smart points:
• Point (179,155) to SmartPointl
• Point (484,172) to SmartPoint2
• Point (374,167) to SmartPoint3
The records of the database will be as shown in the table in Fig. 16.
The Algorithm to match similar Smart Segments in different shapes is based on the SmartPoint Identifiers / INDEX or BOTHs. Once a change is done in the first shape (e.g. insert new node, remove node/s, change node position, change segment type from line to curve etc..) the algorithm compares the new path to the previous one before the change was applied and looks for the segment/s which was changed.
Once a Modified Segment Id ("MSI") is detected, the algorithm loops over the Smart Segment database and looks for a record where segment Index is equal to MSI. If there is a match, it saves the "Smart Point Identifier" as "Smart Segment Start Point" (SSSP). Otherwise it loops on the table looking for a segment index equal to MSI minus one. It continues looping and searching for the previous index etc, until the SSSP is detected or the index will be less than zero.
If no SSSP is detected - Finish.
Then it looks for Smart Segment End Point (SSEP): It loops over the table and looks for a segment index equal to MSI+1. If a match is founded, it will save the "Smart Point Identifier" as SSEP. Otherwise loop with the next index - till a match is found or it reaches the end of the path.
In case a pair of SSSP and SSEP was found, a Smart Segment is recognized.
Note that pair of (SSSP,SSEP) is equivalent to the pair (SSEP,SSSP) since the path direction is not matter when detecting Smart Segments.
For each Smart Segment its Sub-path (SSSubPath) can be defined as a set of path's segments from SSSP to SSEP. This sub-path can be represented as a graphic object using any vector image format (e.g. SVG).
Once a change was made in the first shape (e.g. insert new node, remove node/s, change node position, change segment type from line to curve or vice versa etc..) and the relevant Smart Segment was detected (SSSP,SSEP) using the shape's database (DBl), the algorithm looks for similar Smart Segments in other shapes that a change needs to be copied to.
The other shape which has a similar database (DB2) may have a similar Smart Point Identifiers / Smart Point indexes. The algorithm loops on records in DB2 and looks for Smart Points with similar ID/Index to SSSP and SSEP.
If such pair does not exist, the algorithm moves to the next shape.
Once a pair of records is detected the algorithm takes the segment index from each record
SSSP->Start Segemnt Index (Si)
SSEP->End Segment Index (S2)
It sorts them in ascending order (Sl,S2 => sl<s2 ).
The algorithm looks if there is at least one record R in DB2 which the segment index is between those numbers (sl<R.SegemntIdx<S2) If such record exists the algorithm continues the search for smart segment— and continues to look if there are other pairs of records where SSSP and SSEP exists. If there are no such pairs it moves to the next shape/path.
An example for an implementation of a different algorithm to detect the smart segment on the second shape can be as follows:
Input: SSSP, SSEP— Smart Point Identifiers founded in the Original shape's database.
The algorithm: int f = -1;//Index of segment at the head of the Seg.
int t = -1; //Index of segment at the tail of the Seg.
//Temp indexes
int from_dw = -1; int to_dw = -l;//For forward search, int from_up = -1; int to_up = -l;//For backward search. bool bReverse = false;
//Look if we have a fragment start with sxl and finished with sx2,
//or a fragment start with sx2 and finished with sxl.
string si = SSSP;
string s2 = SSEP;
if (si == 52)
{
//Sub=Path looks like a "point" or "closed path" - We do not replace it. return;
}
for (int i = ø; i < this.getPathlmpQ .numSegsQ; i++)
{
String si = SxIndexTi] ;// Found a record with Segemnt Index equal to i if (si == null)
{//segment is not attached to any SX.
continue;
}
if (si != si && si != s2)
{//reset our search (both "forward" and "backward")
from_up = -1;
from_dw = -1;
}
if (si == si)
{
from_dw = i;
to_up = i;
if (from_up >= 0)
{// We have a match in the backward search ("up"),
f = from_up; t = to_up;
bReverse = true; //We have to reverse the segment, break;
}
}
if (si == s2)
{
to_dw = i;
if (from_dw >= ø)
{// We have a match in the forward search ("down")
f = from_dw; t = to_dw;
bReverse = false; //We do NOT have to reverse the segment, break;
}
from_up = i;
}
}
if (f < 0 II t < 0)
{//We do not have a pair,
return;
}
//Do we have to reverse the path?
If(bReverse)
{ reverse the path so it will be easy to apply changes from the other Smart Segment.
}
After a pair of Sl,S2 which has no Smart Point "in the middle" is detected the algorithm has to copy SSSubPath from the first shape/path/letter to this path. (See next section)
After applying the changes to the new shape the shape's database has to be modified to reflect the changes in segments and nodes/points.
Adaptations to sub-path to fit the second shape are done as follows:
Since the position of Control Points in different shapes may be different - the sub-path cannot be copied as is, and a transformation has to be applied first, before the sub-path is copied to the second letter.
A transformation of sub-path on 2 dimension surface is done with a combination of the following Vector Graphics commands: Transfer, Rotate, Scale.
The following order of commands yielded the best results and, therefore, this is one preferred method to carry out invention, although of course less precise results can be obtained using alternative orders: translate( - sXj - sy)
scale( scx , scy )
rotate(rtt)
translate(tX j ty)
translate(sx j Sy )
The parameters for each command are derived from the Smart Points' position in the surface.
Input: (SSSP1, SSEPl) (SSSP2, SSEP2) - Smart Points identifiers founded in previous steps. dl = (SSEPl.x-SSSPl.x); //Distance on X between original SS's points.
d2 = (SSEP2.X - SSSP2.x); //Distance on X between "target" SS's points, sex = (dl==0 II d2==0) ? 1: d2/dl; //Scale on X
d3 = (SSEPl.y - SSSPl.y); //Distance on Y between original SS's points. d4 = (SSEP2.y - SSSP2.y); //Distance on Y between "target" SS's points, scy = (d3 == 0 II d4==0) ? 1 : d4 / d3; //Scale on Y
ango = calcAngle(SSSPl.x, SSSPl.y, SSEPl.x, SSEPl.y);
angT = calcAngle(SSSP2.x, SSSP2.y, SSEP2.X, SSEP2.y);
Sx= SSSPl.x;
Sy = SSSPl.y;
Tx = SSSP2.X - SSSPl.x;
Ty = SSSP2.y - SSSPl.y;
Rtt = angT - angO;
function calcAngle (xl, yl^ x2, y2) {
var dx = x2 - xl;
var dy = y2 - yl;
var angle = Math . atan2(dy, dx);
return angle;
Although embodiments of the invention have been described by way of illustration, it will be understood that the invention may be carried out with many variations, modifications, and adaptations, without exceeding the scope of the claims.

Claims

Claims
1. A method for creating a controllable and versatile connection between graphical objects, comprising the steps of: a. drawing a path for determining a skeleton of each graphical object; b. applying an outline generator algorithm on said path for automatically generating an outline to each of said skeleton, wherein said skeleton includes control nodes so that said outline is controlled by said skeleton and wherein the nodes of said skeleton are correlated with the nodes of the outline; c. connecting selected control nodes of each skeleton of said graphical objects to a system of smart points; and d. selecting one or more graphical objects to perform a synchronized change in the form of said selected graphical objects, thereby allowing to perform relative synchronized change, among said selected graphical objects.
2. A method according to claim 1, wherein creating the outline of a graphical object comprises the steps of: a. generating said outline relatively to the position of the control nodes on the skeleton; and b. changing said outline according to the change of the control nodes on said skeleton.
3. A method according to claim 1, wherein controlling the outline with the skeleton is done by moving the control nodes perpendicular to the skeleton or by moving said control nodes creating an angle with the tangent to the skeleton symmetrically or asymmetrically.
4. A method according to claim 1, wherein controlling the outline with the skeleton is done by creating a symmetrical outline where the width is identical in both sides of the skeleton or by creating a positive symmetrical outline where the right side or the top of the skeleton is broader or creating a negative symmetrical outline where the left side or the bottom of the skeleton is.
5. A method according to claim 1, wherein controlling the outline with the skeleton is done by creating a symmetrical or asymmetrical outline where the width of the outline is controlled and changed along the skeleton.
6. A method according to claim 1, wherein controlling the outline with the skeleton is done by handles of the nodes of the skeleton, wherein moving the handles is synchronized with the parallel handles on the outline, directly or relatively.
7. A method according to claim 1, wherein controlling the outline with the skeleton is done by creating more nodes on the skeleton which creates new nodes on the outline
8. A method according to claim 1, wherein controlling the outline with the skeleton is done by creating more nodes on the outline which creates new nodes on the skeleton.
9. A method according to claim 1, wherein controlling the outline with the skeleton is done by deleting nodes in the skeleton or the outline, which deletes nodes on the outline or skeleton respectively.
10. A method according to claim 1, wherein controlling the outline with the skeleton is done by moving the skeleton's nodes.
11. A method according to claim 1, wherein controlling the outline with the skeleton is done by moving a node on the outline so that the corresponding point on the skeleton can move the parallel node in the second side of the outline accordingly.
12. A method according to claim 1, wherein said Smart Points system synchronize paths of different graphical objects.
13. A method according to claim 1, wherein moving one or more smart points in one graphical object, changes the nodes of all the selected graphical objects which are connected to the same smart point in each of the different graphical objects.
14. A method according to claim 10, wherein adding, moving or removing nodes in a subpath between smart points of a first graphical object adds, moves or removes nodes in the path of all the graphical objects which are connected to the same smart points in each of the different graphical objects.
15. A method according to claim 13, wherein a subpath between smart points in a first graphical object is updated with appropriate adaptations in other selected graphical objects in which a corresponding smart point is located in a different location.
PCT/IL2014/050715 2013-08-15 2014-08-07 A method for creating a controlled and versatile connection between graphical objects WO2015022683A1 (en)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
IL227983 2013-08-15
IL22798313 2013-08-15

Publications (1)

Publication Number Publication Date
WO2015022683A1 true WO2015022683A1 (en) 2015-02-19

Family

ID=52468109

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/IL2014/050715 WO2015022683A1 (en) 2013-08-15 2014-08-07 A method for creating a controlled and versatile connection between graphical objects

Country Status (1)

Country Link
WO (1) WO2015022683A1 (en)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107998656A (en) * 2017-11-22 2018-05-08 福建天晴数码有限公司 A kind of method of combination and terminal
CN112132928A (en) * 2020-09-18 2020-12-25 网易(杭州)网络有限公司 Vector diagram processing method and device, electronic equipment and computer readable medium

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US4748443A (en) * 1984-09-07 1988-05-31 Hitachi, Ltd. Method and apparatus for generating data for a skeleton pattern of a character and/or a painted pattern of the character
EP0983859A1 (en) * 1998-09-03 2000-03-08 Sharp Kabushiki Kaisha Information processing apparatus and recording medium with pattern generation programs recorded thereon
US20100188408A1 (en) * 2009-01-26 2010-07-29 Perry Ronald N Method for Improving Uniform Width Character Strokes Using Multiple Alignment Zones

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US4748443A (en) * 1984-09-07 1988-05-31 Hitachi, Ltd. Method and apparatus for generating data for a skeleton pattern of a character and/or a painted pattern of the character
EP0983859A1 (en) * 1998-09-03 2000-03-08 Sharp Kabushiki Kaisha Information processing apparatus and recording medium with pattern generation programs recorded thereon
US20100188408A1 (en) * 2009-01-26 2010-07-29 Perry Ronald N Method for Improving Uniform Width Character Strokes Using Multiple Alignment Zones

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
"Example-based automatic font generation'';", SMART GRAPHICS, 2010, BERLIN HEIDELBERG, pages 127 - 138, Retrieved from the Internet <URL:http://www-ui.is.s.u-tokyo.ac.jp/~takeo/papers/rapee_smartgraphics2010_font.pdf> [retrieved on 20101231] *

Cited By (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107998656A (en) * 2017-11-22 2018-05-08 福建天晴数码有限公司 A kind of method of combination and terminal
CN107998656B (en) * 2017-11-22 2020-12-22 福建天晴数码有限公司 Arranging method and terminal
CN112132928A (en) * 2020-09-18 2020-12-25 网易(杭州)网络有限公司 Vector diagram processing method and device, electronic equipment and computer readable medium

Similar Documents

Publication Publication Date Title
EP0167838B1 (en) Method for producing a scaleable typeface data
Ersoy et al. Skeleton-based edge bundling for graph visualization
Brosz et al. Transmogrification: Causal manipulation of visualizations
Wu et al. ViSizer: a visualization resizing framework
van Oosterom et al. Vario-scale data structures supporting smooth zoom and progressive transfer of 2D and 3D data
CN102156688B (en) Character transforming effect processing method and device
CN110851118B (en) Vector icon drawing method and device for three-dimensional scene
CN105760536A (en) Geological map database establishing device and geological map database establishing device method based on geological database
US5640589A (en) Method and device for generating graphic data using a writing motion model
KR20160025519A (en) Selecting and editing visual elements with attribute groups
Zhang et al. Chinese calligraphy specific style rendering system
JP2015228021A (en) Technique for processing character string for graphical representation on man/machine interface
WO2015022683A1 (en) A method for creating a controlled and versatile connection between graphical objects
US8836699B2 (en) Generation of landmark architecture and sculpture based on chinese characters
CN104919454A (en) Managing interactions with data having membership in multiple groupings
CN101923724B (en) Page cutting method
CN106959939B (en) Hollow character library generation method and hollow character library generation system
Takahashi et al. PaintersView: Automatic suggestion of optimal viewpoints for 3D texture painting
Zhao et al. Trajectory generation for calligraphy writing animation
Fouladi et al. Toward automatic development of handwritten personal Farsi/Arabic OpenType® fonts
Korfiatis et al. Three-dimensional object metamorphosis through energy minimization
JP3647075B2 (en) Image search method and apparatus
CN115690376A (en) Method for creating airborne control panel character three-dimensional model
Wen et al. A Rotation-Strain Method to Model Surfaces using Plasticity
Li et al. Texture-driven adaptive mesh refinement with application to 3D relief

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 14836602

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 14836602

Country of ref document: EP

Kind code of ref document: A1