[tw] Re: Interactive SVG Image Map does not work for TW5
I usually run the svg code thru https://petercollingridge.appspot.com/svg-editor My favorite svg-minimizer :) Den söndag 25 februari 2018 kl. 14:07:41 UTC+1 skrev @TiddlyTweeter: > > One method to help debug SVG issues is to take the SVG code and put it > through a "MINIMISER" to strip out stuff that may be proprietary (i.e. > won't work universally reliably), here is a good one of many: > https://jakearchibald.github.io/svgomg/ > > SVG should work well across browsers if its well constructed. Sometimes > SVG is "ahead of the game"-- meaning its possible to design SVG in > specialist apps that produce SVGs that are not fully cross-browser > compatible and that in some rendering situations will fail in apparently > unpredictable ways. > > Best wishes > Josiah > > Ton Gerner wrote: > >> I don't know what goes wrong with the embedded SVG. >> > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/7e944ae9-336a-4814-a386-87abfe2e4d03%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
that should have read double blank lines
On Sunday, February 25, 2018 at 6:46:59 PM UTC+1, BJ wrote:
>
> note that tiddlywiki turns double spaces into paragraphs - so I would
> advise to remove all blank lines
>
> On Sunday, February 25, 2018 at 3:40:03 PM UTC+1, oleghbond wrote:
>>
>> Thanks, your advice helped partially.
>>
>> I passed the latter svg-image through Minimiser in the following way: all
>> the options were switched ON, except (1) Show original, (2) Remove xmlns,
>> (3) Style to attributes, (4) Move group attrs to elements, (5) Remove style
>> elements.
>>
>> After that the svg-code being put directly in a tiddler is revealed
>> correctly. It even shows the xlink:href address (in the left bottom corner
>> of a browser windows) while hovering. Further on, all the tested browsers
>> Chrome, Edge and Firefox perform the desired jump to the link "#Intro".
>> Chrome does not show the change of the mouse pointer from the arrow to the
>> hand while hovering the active area.
>>
>> In all the browsers I did not succeed the next attempt to perform the
>> jump to the link "#Intro". After the first succesful jump I noticed in the
>> web-address bar (in all of the browsers) the destination permalink
>> web-address "https://protw.github.io/eco/#Intro;, which is
>> usually.appears by request.
>>
>> The "minimised" code looks as follows:
>> http://www.w3.org/2000/svg; xmlns:xlink="
>> http://www.w3.org/1999/xlink; color-interpolation-filters="sRGB" viewBox="0
>> 0 362.224 305.531" style="fill:none;fill-rule:evenodd;font-size:12px;
>> overflow:visible;stroke-linecap:square;stroke-miterlimit:3">
>>
>> .st1{fill:
>> #dde2cd;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.24}.st2{fill:#000;font-family:Calibri;font-size:1.1em}.st3{stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.75}
>>
>>
>>
>>
>> RECTANGLE
>>
>>
>>
>> > class="st1"/>
>>
>> POLYGON
>>
>>
>>
>>
>>
>>
>> ELLIPSE
>>
>>
>>
>> > transform="translate(74.813 -202.372)"/>
>> > transform="translate(188.199
>> -60.64)"/>
>>
>>
>> *Does anybody have any idea how to force next jumps on the mouse click?*
>>
>>
>>
>> неділя, 25 лютого 2018 р. 15:07:41 UTC+2 користувач @TiddlyTweeter
>> написав:
>>>
>>> One method to help debug SVG issues is to take the SVG code and put it
>>> through a "MINIMISER" to strip out stuff that may be proprietary (i.e.
>>> won't work universally reliably), here is a good one of many:
>>> https://jakearchibald.github.io/svgomg/
>>>
>>> SVG should work well across browsers if its well constructed. Sometimes
>>> SVG is "ahead of the game"-- meaning its possible to design SVG in
>>> specialist apps that produce SVGs that are not fully cross-browser
>>> compatible and that in some rendering situations will fail in apparently
>>> unpredictable ways.
>>>
>>> Best wishes
>>> Josiah
>>>
>>> Ton Gerner wrote:
>>>
I don't know what goes wrong with the embedded SVG.
>>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to tiddlywiki+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/f8c6870e-a2c6-42de-85a7-3ae328b0bc3a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
note that tiddlywiki turns double spaces into paragraphs - so I would
advise to remove all blank lines
On Sunday, February 25, 2018 at 3:40:03 PM UTC+1, oleghbond wrote:
>
> Thanks, your advice helped partially.
>
> I passed the latter svg-image through Minimiser in the following way: all
> the options were switched ON, except (1) Show original, (2) Remove xmlns,
> (3) Style to attributes, (4) Move group attrs to elements, (5) Remove style
> elements.
>
> After that the svg-code being put directly in a tiddler is revealed
> correctly. It even shows the xlink:href address (in the left bottom corner
> of a browser windows) while hovering. Further on, all the tested browsers
> Chrome, Edge and Firefox perform the desired jump to the link "#Intro".
> Chrome does not show the change of the mouse pointer from the arrow to the
> hand while hovering the active area.
>
> In all the browsers I did not succeed the next attempt to perform the jump
> to the link "#Intro". After the first succesful jump I noticed in the
> web-address bar (in all of the browsers) the destination permalink
> web-address "https://protw.github.io/eco/#Intro;, which is
> usually.appears by request.
>
> The "minimised" code looks as follows:
> http://www.w3.org/2000/svg; xmlns:xlink="
> http://www.w3.org/1999/xlink; color-interpolation-filters="sRGB" viewBox="0
> 0 362.224 305.531" style="fill:none;fill-rule:evenodd;font-size:12px;
> overflow:visible;stroke-linecap:square;stroke-miterlimit:3">
>
> .st1{fill:
> #dde2cd;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.24}.st2{fill:#000;font-family:Calibri;font-size:1.1em}.st3{stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.75}
>
>
>
>
> RECTANGLE
>
>
>
> class="st1"/>
>
> POLYGON
>
>
>
>
>
>
> ELLIPSE
>
>
>
>transform="translate(74.813 -202.372)"/>
>transform="translate(188.199
> -60.64)"/>
>
>
> *Does anybody have any idea how to force next jumps on the mouse click?*
>
>
>
> неділя, 25 лютого 2018 р. 15:07:41 UTC+2 користувач @TiddlyTweeter написав:
>>
>> One method to help debug SVG issues is to take the SVG code and put it
>> through a "MINIMISER" to strip out stuff that may be proprietary (i.e.
>> won't work universally reliably), here is a good one of many:
>> https://jakearchibald.github.io/svgomg/
>>
>> SVG should work well across browsers if its well constructed. Sometimes
>> SVG is "ahead of the game"-- meaning its possible to design SVG in
>> specialist apps that produce SVGs that are not fully cross-browser
>> compatible and that in some rendering situations will fail in apparently
>> unpredictable ways.
>>
>> Best wishes
>> Josiah
>>
>> Ton Gerner wrote:
>>
>>> I don't know what goes wrong with the embedded SVG.
>>>
>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to tiddlywiki+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/1ff34763-b462-410d-9360-4f03c2e12ec3%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Thanks, your advice helped partially.
I passed the latter svg-image through Minimiser in the following way: all
the options were switched ON, except (1) Show original, (2) Remove xmlns,
(3) Style to attributes, (4) Move group attrs to elements, (5) Remove style
elements.
After that the svg-code being put directly in a tiddler is revealed
correctly. It even shows the xlink:href address (in the left bottom corner
of a browser windows) while hovering. Further on, all the tested browsers
Chrome, Edge and Firefox perform the desired jump to the link "#Intro".
Chrome does not show the change of the mouse pointer from the arrow to the
hand while hovering the active area.
In all the browsers I did not succeed the next attempt to perform the jump
to the link "#Intro". After the first succesful jump I noticed in the
web-address bar (in all of the browsers) the destination permalink
web-address "https://protw.github.io/eco/#Intro;, which is usually.appears
by request.
The "minimised" code looks as follows:
http://www.w3.org/2000/svg; xmlns:xlink=
"http://www.w3.org/1999/xlink; color-interpolation-filters="sRGB" viewBox="0
0 362.224 305.531" style="fill:none;fill-rule:evenodd;font-size:12px;
overflow:visible;stroke-linecap:square;stroke-miterlimit:3">
.st1{fill:
#dde2cd;stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.24}.st2{fill:#000;font-family:Calibri;font-size:1.1em}.st3{stroke:#000;stroke-linecap:round;stroke-linejoin:round;stroke-width:.75}
RECTANGLE
POLYGON
ELLIPSE
*Does anybody have any idea how to force next jumps on the mouse click?*
неділя, 25 лютого 2018 р. 15:07:41 UTC+2 користувач @TiddlyTweeter написав:
>
> One method to help debug SVG issues is to take the SVG code and put it
> through a "MINIMISER" to strip out stuff that may be proprietary (i.e.
> won't work universally reliably), here is a good one of many:
> https://jakearchibald.github.io/svgomg/
>
> SVG should work well across browsers if its well constructed. Sometimes
> SVG is "ahead of the game"-- meaning its possible to design SVG in
> specialist apps that produce SVGs that are not fully cross-browser
> compatible and that in some rendering situations will fail in apparently
> unpredictable ways.
>
> Best wishes
> Josiah
>
> Ton Gerner wrote:
>
>> I don't know what goes wrong with the embedded SVG.
>>
>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to tiddlywiki+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/c86df769-82a0-4ff6-8df2-53c8c42cff53%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
One method to help debug SVG issues is to take the SVG code and put it through a "MINIMISER" to strip out stuff that may be proprietary (i.e. won't work universally reliably), here is a good one of many: https://jakearchibald.github.io/svgomg/ SVG should work well across browsers if its well constructed. Sometimes SVG is "ahead of the game"-- meaning its possible to design SVG in specialist apps that produce SVGs that are not fully cross-browser compatible and that in some rendering situations will fail in apparently unpredictable ways. Best wishes Josiah Ton Gerner wrote: > I don't know what goes wrong with the embedded SVG. > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/a5dd46d0-c8c8-4921-88eb-7d91a27e5588%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
I am not sure if the > Thanks again, Ton, > > Usually I work with Win 10 + Chrome + TW 5.1.15 on Node.js. > > I've got an svg-file: > > http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";> > > > I observe systematic inconsistencies of how TW5 manages with svg-mages, > namely: > >1. when I drag-and-drop the svg-file into a browser window it works >fine for Mozilla and Edge; for Chrome the mouse pointer is not affected >while it hovers the active area; >2. when I drag-and-drop the svg-file into TW the image is revealed >fine, but no response on hovering the mouse pointer as well as clicking > the >hyperlink of the active area; >3. when I put the code of svg-file into a tiddler I certainly observe >the response on hovering the mouse pointer as well as clicking the >hyperlink of the active area, but the image is revealed in absolutely >unacceptable way (see the two images above); > 1. of course I tried the example of Tobias Beer ( > https://tobibeer.github.io/tb5/#example-svg); it works well; > however, I use standard tools for generation of svg-images such as > draw.io or others and for technological consistency I would prefer > complete absence or at least minimal hand afterprocessing of resulted > images. > > I would be grateful for anyone's assistance. > > субота, 24 лютого 2018 р. 17:41:27 UTC+2 користувач Ton Gerner написав: >> >> Hi, >> >> The pictures you give now are not related to the code you gave in your >> first post. That code gives two rectangles (I entered your code in a >> tiddler at twiddlywiki.com): >> >> >> >> >>> When I say "dead (non responsive)" I mean, that after drag-and-drop the >>> svg-image, >>> >>>1. I do not see change of the mouse arrow while hovering the active >>>region and >>>2. clicking the mouse does not give transfer by the reference. >>> >>> When I hover over the lowest rectangle my mouse pointer changes from an >> arrow to a hand. And as said before, clicking leads to Google. >> I tried with Linux Mint 17.3 + Firefox & Windows 10 + Firefox. >> But when using Chrome the mouse pointer does *not* change (Mint & >> Windows) although clicking leads to Google. >> >> In case I put the svg-code of the image directly to a tiddler >>> >>>1. clicking the mouse gives transfer by the reference, but >>>2. I do not see change of the mouse arrow while hovering the active >>>region and >>>3. the most unpleasant effect is that the image looks unacceptably >>>different of the original (see the two screenshots attached) >>> >>> My knowledge of SVG is very limited.
[tw] Re: Interactive SVG Image Map does not work for TW5
Hi, Using type image/svg+xml has restrictions (sandbox) see https://tiddlywiki.com/#Using%20SVG I don't know what goes wrong with the embedded SVG. Hopefully others can help. Cheers, Ton -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/1f25d01a-ddbe-49d2-92ee-29adfcdbee1d%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Hi, I can confirm: 1. SVG code opened in the browser (Linux Mint, Firefox) looks normal (Rectangle, Ellipse, Polygon + lines). 2. SVG code in Inkscape, SVG-edit or SVG Viewer shows normal 3. SVG code in a tiddler in TW5 shows weird (Linux Mint, Firefox, Chrome) but the link from Ellipse to Intro works. When I set the type of the tiddler to image/svg+xml, it looks normal (Linux Mint, Firefox, Chrome) but the link from Ellipse does not work anymore (!?!). Cheers, Ton -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/80973c50-00e7-4de0-82ff-45cea18086c3%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Thanks again, Ton, Usually I work with Win 10 + Chrome + TW 5.1.15 on Node.js. I've got an svg-file: http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd;> http://www.w3.org/2000/svg; xmlns:xlink= "http://www.w3.org/1999/xlink; xmlns:ev="http://www.w3.org/2001/xml-events; width="5.03089in" height="4.24349in" viewBox="0 0 362.224 305.531" xml:space="preserve" color-interpolation-filters="sRGB" class="st4"> PAGE-1 RECTANGLE POLYGON ELLIPSE I observe systematic inconsistencies of how TW5 manages with svg-mages, namely: 1. when I drag-and-drop the svg-file into a browser window it works fine for Mozilla and Edge; for Chrome the mouse pointer is not affected while it hovers the active area; 2. when I drag-and-drop the svg-file into TW the image is revealed fine, but no response on hovering the mouse pointer as well as clicking the hyperlink of the active area; 3. when I put the code of svg-file into a tiddler I certainly observe the response on hovering the mouse pointer as well as clicking the hyperlink of the active area, but the image is revealed in absolutely unacceptable way (see the two images above); 1. of course I tried the example of Tobias Beer ( https://tobibeer.github.io/tb5/#example-svg); it works well; however, I use standard tools for generation of svg-images such as draw.io or others and for technological consistency I would prefer complete absence or at least minimal hand afterprocessing of resulted images. I would be grateful for anyone's assistance. субота, 24 лютого 2018 р. 17:41:27 UTC+2 користувач Ton Gerner написав: > > Hi, > > The pictures you give now are not related to the code you gave in your > first post. That code gives two rectangles (I entered your code in a > tiddler at twiddlywiki.com): > > > > >> When I say "dead (non responsive)" I mean, that after drag-and-drop the >> svg-image, >> >>1. I do not see change of the mouse arrow while hovering the active >>region and >>2. clicking the mouse does not give transfer by the reference. >> >> When I hover over the lowest rectangle my mouse pointer changes from an > arrow to a hand. And as said before, clicking leads to Google. > I tried with Linux Mint 17.3 + Firefox & Windows 10 + Firefox. > But when using Chrome the mouse pointer does *not* change (Mint & > Windows) although clicking leads to Google. > > In case I put the svg-code of the image directly to a tiddler >> >>1. clicking the mouse gives transfer by the reference, but >>2. I do not see change of the mouse arrow while hovering the active >>region and >>3. the most unpleasant effect is that the image looks unacceptably >>different of the original (see the two screenshots attached) >> >> My knowledge of SVG is very limited. Maybe others can comment on 3, but > then it's wise to give the SVG code used for the pictures in your last post. > > Also: > > 1) What OS and browser are you using? > 2) Did you test Tobias' original code (the 3 rectangles)? > > Cheers, > > Ton > > > > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/8110291e-fa17-46bc-b22a-db100379d5f2%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Hi, The pictures you give now are not related to the code you gave in your first post. That code gives two rectangles (I entered your code in a tiddler at twiddlywiki.com): > When I say "dead (non responsive)" I mean, that after drag-and-drop the > svg-image, > >1. I do not see change of the mouse arrow while hovering the active >region and >2. clicking the mouse does not give transfer by the reference. > > When I hover over the lowest rectangle my mouse pointer changes from an arrow to a hand. And as said before, clicking leads to Google. I tried with Linux Mint 17.3 + Firefox & Windows 10 + Firefox. But when using Chrome the mouse pointer does *not* change (Mint & Windows) although clicking leads to Google. In case I put the svg-code of the image directly to a tiddler > >1. clicking the mouse gives transfer by the reference, but >2. I do not see change of the mouse arrow while hovering the active >region and >3. the most unpleasant effect is that the image looks unacceptably >different of the original (see the two screenshots attached) > > My knowledge of SVG is very limited. Maybe others can comment on 3, but then it's wise to give the SVG code used for the pictures in your last post. Also: 1) What OS and browser are you using? 2) Did you test Tobias' original code (the 3 rectangles)? Cheers, Ton -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/ff178762-daec-4b12-8927-8edd9d5ba030%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Thanks Ton for your response. When I say "dead (non responsive)" I mean, that after drag-and-drop the svg-image, 1. I do not see change of the mouse arrow while hovering the active region and 2. clicking the mouse does not give transfer by the reference. In case I put the svg-code of the image directly to a tiddler 1. clicking the mouse gives transfer by the reference, but 2. I do not see change of the mouse arrow while hovering the active region and 3. the most unpleasant effect is that the image looks unacceptably different of the original (see the two screenshots attached) субота, 24 лютого 2018 р. 15:55:44 UTC+2 користувач Ton Gerner написав: > > Hi, > > I don't know what you mean by dead (non responsive); with your code in a > tiddler I can click the second rectangle which brings me to Google. > It acts the same as this code opened in a browser. What else would you > expect? > As Tobias shows you can use CSS for other effects. > > Cheers, > > Ton > > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/7bac1185-4ea4-47ad-95ee-33fcb25567cd%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw] Re: Interactive SVG Image Map does not work for TW5
Hi, I don't know what you mean by dead (non responsive); with your code in a tiddler I can click the second rectangle which brings me to Google. It acts the same as this code opened in a browser. What else would you expect? As Tobias shows you can use CSS for other effects. Cheers, Ton -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+unsubscr...@googlegroups.com. To post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/b3349245-c380-460a-b6f1-c80faa70cbb3%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
