python-novice-inflammation icon indicating copy to clipboard operation
python-novice-inflammation copied to clipboard

svg file to satisfy issue #943: svg version of pdf/ppt posted there

Open akea013 opened this issue 2 years ago • 3 comments

Instructions

svg version of sc_diagram.pdf in issue #943, named fig/list_diagram.svg

akea013 avatar Aug 04 '21 00:08 akea013

Hi @akea013 , sorry for the delay in reviewing this. I have inserted your provided image in the lists episode about where I think it might go. A couple things I notice:

  1. In the original image suggested, the code and output was for index 0, which might be more fitting in the context of the episode text.
  2. The image seems small in the page to me. Perhaps it could be made bigger?

If anyone else wants to provide feedback, please do (@maxim-belkin ?).

lists_img

Thank you very much for creating this image and opening a pull request @akea013 !

ldko avatar Aug 24 '21 23:08 ldko

Re: The image seems small in the page to me. Perhaps it could be made bigger?

@ldko I've pushed up a scaled-up version of the above svg to my branch - up from 1 to 1.5. Is this an improvement? ( the scaling factor is on the second line of the svg)

akea013 avatar Aug 26 '21 04:08 akea013

I think visuals are an important element of every lesson, so I am +1 for adding one here.

A few comments from me, @akea013 -- please let me know if some of them seem too technical or if you're not sure how to do something (looking at the SVG, however, I see that it's free from tool-specific comments, which to me indicates that you might be comfortable with SVG-specific technicalities).

  1. Let's scale the image using viewBox instead of creating a group.
  2. Colors used for index 1 and 2 are identical for people with Protanopia color blindness.
  3. Colors used for index 2 and 3 are identical for people with Deuteranopia color blindness. See if you can find colors that work for people with both of these color blindnesses. If you look at the main lesson page (https://swcarpentry.github.io/python-novice-inflammation/), in the "Inflammation data" table I used colors that are distinguishable by people with both of these color blindnesses but feel free to use any colors you like.
  4. SVG rectangles don't need an end tag (</rect>) -- instead, use /> at the end of a start tag, e.g.:
    <rect .... />
    
  5. I don't think dx/dy attributes apply to SVG rectangles.
  6. It would've been nice if colored rectangles were of the same height as text, so, perhaps, we could increase font size?
  7. Can you remove extraneous spaces in text elements?
  8. Couple of text elements have solitary tspan elements without any modifications applied to tspans -- in that case, tspans are not necessary.
  9. You might be able to move properties of some elements to the svg element itself, e.g., stroke-width, which, I think, would be better to express in pixels, because the conversion factor is somewhat weird (http://www.unitconversion.org/typography/pixels-x-to-millimeters-conversion.html)

maxim-belkin avatar Aug 26 '21 17:08 maxim-belkin