Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

regarding signal name color and signal width #397

Open
vicky2889 opened this issue Oct 29, 2023 · 9 comments
Open

regarding signal name color and signal width #397

vicky2889 opened this issue Oct 29, 2023 · 9 comments
Labels
question ❓

Comments

@vicky2889
Copy link

Please describe your system environment before submitting your Issue.
hi
1.) can we change the width of signal lines
2.) can we change the color of signal name to black in bold letters
because when I put these figures back in the word file its hard to see clearly very small and dull color
@Ganesh-AT
Copy link

1.) can we change the width of signal lines

No, signal line widths can't be changed. It is NOT necessary because SVG is a vector format. Even if you scale the image, you will not lose any details (as long as it is in SVG format)

2.) can we change the color of signal name to black in bold letters

Yes, you can do that, as shown in the code screenshot below. But, this is not usually required.

image

because when I put these figures back in the word file its hard to see clearly very small and dull color

The reason you are encountering the problem is probably because you have exported to PNG via the menu and tried to embed the PNG. I have seen that the PNG exported by WaveDrom is rasterized at very low resolution. So, it is not possible to embed them into high-quality documents.

My workflow for such documents is to export to SVG, open the SVG in Chrome or Edge, and 'Print to PDF' from the browser's Print menu. The resultant PDF is much more portable and is in vector format. You can zoom in / scale as much as you like without encountering any loss of detail. I have seen that many programs (even ones like Gimp) do not have good / up to date SVG parsers - so intermediate PDF conversion in helpful in such cases.

@vicky2889
Copy link
Author

vicky2889 commented Oct 30, 2023 via email

@vicky2889
Copy link
Author

Hi Ganesh,

I have one issue in the code you provided. Actually I tried with style but i dont know why the names are not visible now.
Can you please check?

{
config: {skin: 'default', marks: true, hscale:1 ,},
head: {tick: 0},
signal: [
{name: ['tspan',{style: 'fill:black; font: bold 11pt helvetica'},'clk'], wave: 'P...........|......',},
{name: ['tspan',{style: 'fill:black; font: bold 11pt helvetica'},'fsm state'], wave: '2.2...............2', data: ['','UPDATE'],},
{name: ['tspan',{style: 'fill:black; font: bold 11pt helvetica'},'addr'], wave: '22.................', data: ['','0'],},
{name: ['tspan',{style: 'fill:black; font: bold 11pt helvetica'},'pout'], wave: 'l.hl...............'},
]

}

@vicky2889
Copy link
Author

image

@Ganesh-AT
Copy link

Yes, this is the issue #398 that I reported yesterday. I have encountered this issue before, and used a workaround (have at least one signal name that is longer than the longest custom tspan entry). However, I see that can't be adopted for your use-case since you have no normal signal names.

The only workaround I can suggest for you is to 'edit' the SVG prior to export:

image

Open up the debugging menu by right-clicking on the waveform and clicking 'Inspect' to bring up the elements as shown above. Double-click on the width property of the SVG element makes it editable. Change it to a wider value as shown below.

image

Then, you can click on the menu and 'Export SVG'. The downloaded SVG should be fine despite the wrong viewbox:

image

You can then print to PDF and embed it in your Word doc or use it any other way.

@vicky2889
Copy link
Author

vicky2889 commented Oct 31, 2023 via email

@Ganesh-AT
Copy link

Ganesh-AT commented Nov 1, 2023 •
edited

While investigating this issue further, I discovered a much more reliable workaround by using invisible Unicode characters in the name of a dummy lane.


{  
  config: { skin: 'default', marks: true, hbounds: [0,7]},
  head:{tick:0},
  signal: [
    {},
    {name: ['tspan',{style: 'fill: black; font: bold 11pt helvetica'},'clock'], 
     wave: 'p.......'},
  {name: ['tspan',{style: 'fill: black; font: bold 11pt helvetica'},'sawtooth'], 
    wave: ['pw', {d: ['m',1,0, 'l',2,1, 'v',-1, 'l',2,1, 'v',-1]}]},
  {name: ['tspan',{style: 'fill: black; font: bold 11pt helvetica'},'triangle'],
   wave: ['pw', {d: 'm,0,0  l,2,1  l,2,-1  l,2,1  l,2,-1'}]},
    {name: ['tspan',{style: 'fill: black; font: bold 11pt helvetica'},'RC'],  
   wave: ['pw', {d: 'm,0,0 q,.5,1,1,1 h,1 q,.5,-1,1,-1 h,1 q,.5,1,1,1 h,1'}]},
  {name: ['tspan',{style: 'fill: black; font: bold 11pt helvetica'},'sin'], 
   wave: ['pw', {d:'m,0,.5 q,.25,1,.5,0 t,.5,0,.5,0,.5,0,.5,0,.5,0,.5,0,\
                                .5,0,.5,0,.5,0,.5,0,.5,0,.5,0,.5,0,.5,0,.5,0'}]},
    // Dummy lane with blank characters to increase the width 
    // for the labels segment (\u2800 is an invisible Unicode character)
    {name: '\u2800\u2800\u2800\u2800\u2800'}, 
  ]
}

Check the example in the screenshot below for the same case mentioned in the previous reply

image

@vicky2889
Copy link
Author

vicky2889 commented Nov 1, 2023 via email

@drom
Copy link
Member

drom commented Nov 3, 2023

signal line style can be changed by changing skin as explained here https://github.com/wavedrom/wavedrom/tree/trunk/unpacked

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
question ❓
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@drom @Ganesh-AT @vicky2889