R | ECharts | logo, title and background, CORS issues

rich.colors.R

library(echarty)
radial_gradient <- htmlwidgets::JS(
  "new echarts.graphic.RadialGradient(0.3, 0.3, 0.8)"
  #  ,[{ offset: 0, color: 'red'}, { offset: 1, color: 'red'}])"
)
color_stops <- htmlwidgets::JS(
  "[{ offset: 0, color:'gold' }, // color at 0% 
    { offset: 0.5, color:'MediumSlateBlue' }, // color at 50%
    { offset: 1, color:'skyblue' // color at 100%
  }]"
)
ec.init(title=list(
  text='{a| } {b|🢀 here is the logo}', 
  textStyle = list(
    rich=list( 
      a= list(height=30, backgroundColor=list(
        image='http://simpleicon.com/wp-content/uploads/glass-64x64.png')),
      b= list( color='teal', fontSize= 24, fontWeight= 400))
  ) ), 
  backgroundColor = list(type = "radial",
     x = 0.5, y = 0.5, r = 0.5,
     backgroundColor = radial_gradient,
     colorStops = color_stops )
)

@benubah, rich format is tricky. Had fun playing with these settings.

Thanks! Does this mean, it can't work with echarts4r? How can echarty be used with dplyr verbs such as group_by? I have a case where there are many charts already setup and work with echarts4r and even if we could switch, it would necessarily work with dplyr verbs.
Happy to learn!

It may work with echarts4r, but I'm not using it anymore.
echarty loves dplyr, here is a one-liner with group_by: iris |> group_by(Species) |> ec.init()
same in 3D: iris |> group_by(Species) |> ec.init(load='3D')
The gallery has plenty of examples with code.

That's wonderful! Thanks very much!

@helgasoft The problem with this is that, once an image is attached to the plot title or anywhere in the plot, downloading the image using echarts' toolbox: feature breaks. No longer works

Good catch. ECharts are aware of the problem and discussing it - apache/echarts#15117.
The consensus is that there is no issue with images hosted on the same domain.
For external images there is a CORS problem.
Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported

The simplest way is to encode the image to base64 format with a converter.

library(echarty)
p <- ec.init(title=list(
  text='{a| } {b|🢀 here is the logo}', 
  textStyle = list(
    rich=list( 
      a= list(height=30, backgroundColor= list(
        image='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACx0lEQVRYR+2WW0hUURSGvz1njuMlM0aYboMGJWmBhaYxYGoaFEKg4osvPVXQS0QFERVdBJEgKOihIIgg6KGXJEhCouxClhrlWEpggWTGmDp4m8s5MzvOzAQS6oxCRyIPrKez917f+vfP2kuwxJ9Y4vwsA/y7Cki4GPPPsIDri/XSohWQIGNJ+wTk/ZcA6UAp0CZg0lQFJNQ1w6f38PA8FAHjAvTFQCzKAxIOBSHrJxxfB4WAR8ComQC1gA1oATYBkwL6zAQoB+xAZwzEKeCpmQCXgAYBmoSNwG4Bt8wEyDRkBxoFnJBQL+CemQA1xv0L8MtoE9or4KopAJLIC+oAsgR0GNUDAwJemQVgExCQsBUoBu4Chgm/mgWwFqgEmgFLLKoF3P6rAF7ozYDcOEnkZ4ejdrPH8yBRmHk7oZRSvOhyn/VpnKmodNms01NoEIlwLINxgCFDEqAAHeeaGN5XRapKmxpM2l9SkjsxH8ycAG1vuw+PB7k5Og2TGhysc5Hkm4pb2KOTTXwpryJNBXtKJC6XFuWfmmvjrADPOt1HPRPy2tAUjOkwFYSGAy5s/vgAd4400WMA2CDTCuvTYfUK6Sop3NY+G8SsAI9fd+v9oyiDARgcg2kdrlyowTnUP68CEkHjsRu481yssoHTDtkpkJ1BU1lx/umEAZ686f444GWLJwjeAEz6IaBDKAxSSiy6hlXXEVISViyErCpSsaJYQFWIVJ8eU8C5EqxrUpKrcnICCQMY5mttd/8Y8eHw+sAnoy1PC0PImMVmzGMRE4poqBZIFtHIsIE9Fb+qqM49O/NGFuSB34vbuj5U+IPi/rSG3a9HVdBCEP4DIFK5BWxWSFYh1cq3FDVcv2vH9pfxXJvQQGIo8vxdT64MUa1LyqSUG6QkTUBYCLwWZK8iLK2KqrWUFBR8j5d05v+EABZy4ELXLgMsuQK/AAs98iHakpmuAAAAAElFTkSuQmCC'
      )),
      b= list( color='teal', fontSize= 24, fontWeight= 400))
  ) )
)
p$x$opts$toolbox <- list(feature=list(saveAsImage=list(backgroundColor='#111')))
p

or use library base64enc to avoid CORS issues
paste0("data:image/png;base64,", base64enc::base64encode('http://simpleicon.com/wp-content/uploads/glass-64x64.png'))

Good news! Thanks a lot!