改变R中onRender（）htmlWidgets散点图中的线条粗细和不透明度 [英] Changing line thickness and opacity in scatterplot on onRender() htmlWidgets in R

问题描述

我希望使用R包htmlwidgets的onRender（）函数来制作一个图表，用户可以点击一个点并绘制一条线。我现在有一个关键的问题，那就是灰色的线条是以其默认厚度绘制的，也可能是其默认的不透明度。

然而，我一直在改变厚度（可能会改变线条的不透明性，虽然它可能正在工作，但由于线条太细，我看不到它）。我希望线条很厚很透明。我尝试了几个参数和线宽和不透明度的方法（其中一些在下面注释），但似乎它们没有区别。任何想法，我可能会失踪？谢谢。

  library（plotly）
 library（扫帚）
 
 dat < -  mtcars 
 dat $ mpg < -  dat $ mpg * 10 
 
p < -  ggplot（data = dat，aes（x = disp，y = mpg））+ geom_point（size = 0.5）
 
 ggplotly（p）％>％
 onRender（
 function（el，x，data）{
 //减少除了悬停一个
 el.on（'plotly_click'，函数（e）{
 
 var trace1 = {
x：[100，400]，
y：[100， 400]，
模式：'lines'，
 // line：dict（color：'gray'，width：100）
 marker：{
 color：'gray'， 
 size：200，
 width：1000，
 opacity：0.5 
} 
} 
 Plotly.addTraces（el.id，trace1）; 
}）
} 
，data = dat）
  

解决方案

opacity 会需要在跟踪对象中。你的行对象有一些语法问题，它可以防止Javascript读取它。

  gp％>％onRender（
 function（el，x，data）{
 
 el.on（'plotly_click '，函数（e）{
 
 var trace1 = {
x：[100,400]，
y：[100，400]，
 mode：'lines' ，
 line：{
 color：'gray'，
 width：100 
}，
 opacity：0.8，
} 
 Plotly。 addTraces（el.id，trace1）; 
}）
}，data = dat）
  

I am hoping to make a plot using the R package htmlwidgets' onRender() function in which a user can click on a point and a line is drawn. I have the crux of it working right now where a gray line is drawn at its default thickness and probably its default opaqueness.

However, I have been stuck on changing the thickness of the line (and possibly changing the opaqueness of the line, although it may be working and I cannot see it since the line is so thin). I want the line to be very thick and rather transparent. I tried several parameters and approaches for line width and opaqueness (some of which are commented out below), but it seems they do not make a difference. Any ideas what I may be missing? Thank you.

library(plotly)
library(broom)

dat <- mtcars
dat$mpg <- dat$mpg * 10

p <- ggplot(data = dat, aes(x=disp,y=mpg)) + geom_point(size=0.5)

ggplotly(p) %>%
  onRender("
           function(el, x, data) {
            // reduce the opacity of every trace except for the hover one
            el.on('plotly_click', function(e) {

              var trace1 = {
                 x: [100, 400],
                 y: [100, 400],
                 mode: 'lines',
                 //line: dict(color: 'gray', width: 100)
                 marker: {
                   color: 'gray',
                   size: 200,
                   width: 1000,
                   opacity: 0.5
                 }
              }
              Plotly.addTraces(el.id, trace1);
           })
          }
          ", data=dat)

解决方案

The opacity would need to be in the trace object. Your line object has some syntax issues which prevents Javascript from reading it.

gp %>% onRender("
function(el, x, data) {

  el.on('plotly_click', function(e) {

  var trace1 = {
    x: [100, 400],
    y: [100, 400],
    mode: 'lines',
    line: {
        color: 'gray', 
        width: 100
    },
    opacity: 0.8,
  }
  Plotly.addTraces(el.id, trace1);
})
}", data=dat)

这篇关于改变R中onRender（）htmlWidgets散点图中的线条粗细和不透明度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！