search

Hareeshchandera / jsplumb

Automatically exported from code.google.com/p/jsplumb
0 stars 0 forks source link

dashed style #129

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago 
Hello, i'm not able to make a connection with dashed paintstyle.
Could you explian to me what is the solution ?
i'm using VML rendering
paintStyle:{ strokeStyle:"grey", lineWidth:1, dashstyle:??????? };

thanks for your answer

Original issue reported on code.google.com by pascal.l...@univ-orleans.fr on 21 Sep 2011 at 7:20

GoogleCodeExporter commented 8 years ago 
take a look in the documentation at the 'Paint Styles' section, specifically 
the subsection 'Paint Style Parameters'.

the 'dash style' attribute goes where you were thinking, but you just need to 
read the VML spec to find the appropriate syntax for it.  i might beef up the 
jsplumb documentation to include a few examples at some stage.

jsplumb docs:

http://jsplumb.org/doc/usage.html

vml spec:

http://www.w3.org/TR/NOTE-VML

here's an excerpt of their docs:

The dashstyle attribute allows the user to specify a custom defined dash 
pattern.  This is done using a series of numbers.  Dash styles are defined in 
terms of the length of the dash (the drawn part of the stroke) and the length 
of the space between the dashes.  The lengths are relative to the line width - 
a length of "1" is equal to the line width.  The endcap style is applied to 
each dash, the arrow style is not.  The string first defines the length of the 
dash then the length of the space.  This may be repeated to form complex dash 
styles.   The string should always contain a pair of numbers.  If it contains 
an odd number of numbers the last should be disregarded.  The following table 
lists some typical values and a description of the intended effect.  "0" 
implies a dot which should be four-fold symmetrical (with round end caps it 
should be a circle).   If the line end cap is flat a viewer should choose a 
built-in operating system dash where possible (i.e. something which is fast to 
draw).

dashstyle Example   Description
"2 2"   short-dashes (each dash and the space in between is twice the width of 
the line)
"0 2"   dots (space between is twice the width of the line)
"2 2 0 2"   short-dash dot
"2 2 0 2 0 2"   short-dash dot dot
"1 2"   dot (each dash is the width of the line while each space is twice the 
width of the line)
"4 2"   dash (each dash is four time the width of the line while each space is 
twice the width of the line)
"8 2"   long-dash
"4 2 1 2"   dash dot
"8 2 1 2"   long-dash dot
"8 2 1 2 1 2"   long-dash dot dot

Original comment by simon.po...@gmail.com on 21 Sep 2011 at 1:03

GoogleCodeExporter commented 8 years ago 
that what i done : 
paintStyle:{ strokeStyle:"blue", lineWidth:10, dashstyle:"2 2" },
and it doesnt works (same as without dashstyle)
may be i miss something
thanks for your answer

Original comment by pascal.l...@univ-orleans.fr on 21 Sep 2011 at 1:57

GoogleCodeExporter commented 8 years ago 
i dont suppose you could recreate this in jsfiddle, could you?  without seeing 
the code i can only make guesses.

Original comment by simon.po...@gmail.com on 22 Sep 2011 at 8:12

GoogleCodeExporter commented 8 years ago 
sorry but my english is not so good, i think you need code then i made a
pastebin : http://pastebin.com/6Vd4URDw

thanks again for your answer

Original comment by pascal.l...@univ-orleans.fr on 22 Sep 2011 at 8:44

GoogleCodeExporter commented 8 years ago 
I made an other test with svg because i saw that firefox doenst support vml
http://pastebin.com/Ry6bPYEJ
same i cant make it works

thanks again for your help

Original comment by pascal.l...@univ-orleans.fr on 22 Sep 2011 at 1:47

GoogleCodeExporter commented 8 years ago 
I forgot to tell you that i'm using firefox 3.5.16 (iceweasel)

Original comment by pascal.l...@univ-orleans.fr on 22 Sep 2011 at 3:11

GoogleCodeExporter commented 8 years ago 
arghhhhhhhhhhhhhhhh
it works with firefox 6
thanks again !!

Original comment by pascal.l...@univ-orleans.fr on 22 Sep 2011 at 3:16

GoogleCodeExporter commented 8 years ago 
so is this all working for you now?  i will close the defect if so.

Original comment by simon.po...@gmail.com on 7 Oct 2011 at 10:46

GoogleCodeExporter commented 8 years ago 
this might be useful - just put it together for someone else who was having 
trouble with dashed styles:

http://jsfiddle.net/sporritt/zYqwQ/

..closing this out.

Original comment by simon.po...@gmail.com on 17 Oct 2011 at 8:42