====== SVG viewer ====== On [[https://stackoverflow.com/questions/52576376/how-to-zoom-in-on-a-complex-svg-structure|Stackoverflow]] we can find some solutions on how to include an SVG picture into a web page and add some interaction options supported by the code in Javascript. I selected the solution by Sven Liivak (Oct 6, 2018)

SVG viewer

... SVG picture
Touch the node or symbol to display its label.
Touch the legend item to display cluster members, and click the legend item to turn the cluster on/off.
Use the mouse position to select a location and the wheel to zoom in/out
 The ''svg'' tag has to contain '' > wdir <- "C:/Users/vlado/docs/papers/2023/mark/SVGviewer" > setwd(wdir) > makeSVGviewer <- function(svgFile,viewFile,width=0,height=0){ + scr <- readLines("https://raw.githubusercontent.com/bavla/mark/main/R/script.txt") + svg <- readLines(svgFile) + i <- grep("\n

SVG viewer

\n\n
\n" + svgHead <- '0) svgHead <- paste(svgHead,'width=',width,' height=',height,sep="") + svg[i] <- gsub(" makeSVGviewer("tooltips2.svg","svgPajek.html",width=500,height=400) I put the function ''makeSVGviewer'' on GitHub. To produce the HTML file we need two lines > source("https://raw.githubusercontent.com/bavla/mark/main/R/SVGviewer.R") > makeSVGviewer("tooltips2.svg","svgPajek.html",width=800,height=800) [[..:svg:ex1|Example 1]]; [[..:svg:ex2|Example 2]] This can be done also in the HTML file using Javascript - see [[https://www.w3schools.com/howto/howto_html_include.asp|W3schools]] or [[https://stackoverflow.com/questions/8988855/include-another-html-file-in-a-html-file|stackoverflow]]. ===== URLs ===== - http://mrvar.fdv.uni-lj.si/pajek/Symbols/symbols-examples.htm ; http://mrvar.fdv.uni-lj.si/pajek/Symbols/tooltips2.svg - https://stackoverflow.com/questions/10643426/how-to-add-a-tooltip-to-an-svg-graphic - https://stackoverflow.com/questions/52576376/how-to-zoom-in-on-a-complex-svg-structure - https://d3js.org/d3.v7.min.js - https://github.com/sonntam/node-red-contrib-xstate-machine - http://thenewcode.com/1094/Using-JavaScript-in-SVG - https://www.w3schools.com/tags/att_script_src.asp - https://hitokun-s.github.io/old/demo/path-between-two-svg.html