Плотно цвет не меняется Javascript - PullRequest
0 голосов
/ 31 марта 2020

Я работаю над проектом, который требует, чтобы я использовал входные данные графа csv. Я использовал заговор, и до сих пор он, кажется, работает очень хорошо.

Однако, когда я пытаюсь изменить цвет графиков (линий и маркеров), это не работает. Я публикую выдержки из моего кода, так как в целом цвет - это небольшая часть кода, и я не хочу, чтобы здесь все дампы.

//There's multiple charts so changing color is important
var r = Math.random() * 256
var g = Math.random() * 256
var b = Math.random() * 256

...
//used these as a vars so I can change things to test easily (multiple time series being used)
 var color='rgb('+r+', '+g+', '+b+')'
var colora='rgba('+r+', '+g+', '+b+', '+'0.14'+')' 

...
//layout of markers
{
                x: time,
                y: time,
                z: data1,
                line: {
                  reversescale: false,

                  //color: "'"+color+"'" 
                  color: "'rgb("+r+', ' +g+', '+ b+")'",

                },
                //mode: 'lines',
                marker: {
                  //color: "'"+color+"'",
                  color: "'rgb("+r+', ' +g+', '+ b+")'",
                  size: 3,
                  line: {
                    //color: "'"+colora+"'",
                    color: "'rgb("+r+', ' +g+', '+ b+")'",
                    width: 0.1
                  },
                  opacity: 0.8
                },
                type: 'scatter3d'
              }

Обе попытки просто дают мне стандартные черные точки. Когда я пробовал константы, которые отлично работали (что-то вроде color: 'rgb (100,100,240)'). Есть что-то, чего я здесь не хватает? Я console.logged эту вещь, и это, кажется, не проблема со структурой моих переменных.

Ответы [ 2 ]

1 голос
/ 31 марта 2020

У вас слишком много кавычек вокруг строк rgb. Чтобы избежать путаницы при объединении строк, вы также можете использовать строки шаблона. См. Рабочую скрипку ниже.

const r = 0;
const g = 255;
const b = 0;
const color = 'rgb(' + r + ',' + g + ',' + b + ')';
const colorTemplate = `rgb(${r},${g},${b})`;

var trace1 = {
  x: [1, 2, 3, 4],
  y: [10, 15, 13, 17],
  type: 'scatter',
  marker: {
    color: color
  }
};

var trace2 = {
  x: [1, 2, 3, 4],
  y: [16, 5, 11, 9],
  type: 'scatter',
  marker: {
    color: colorTemplate
  }
};

var data = [trace1, trace2];

Plotly.newPlot('myDiv', data);
<head>
	<!-- Load plotly.js into the DOM -->
	<script src='https://cdn.plot.ly/plotly-latest.min.js'></script>
</head>

<body>
	<div id='myDiv'><!-- Plotly chart will be drawn inside this DIV --></div>
</body>
0 голосов
/ 31 марта 2020

Проблема с моим кодом в том, что я использую vars. Переключившись на consts, я могу починить вещь. Я не уловил, что цвет не меняется, потому что по какой-то причине легенда отображала правильные цвета, но маркеры и линии не принимают это.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...