Zingchart: Целевая множественная серия в правиле с использованием токенов

Мне интересно, можно ли настроить несколько рядов в одном правиле с помощью токенов. По сути, для чего я стремлюсь, «если значение из серии 1 больше значения в той же позиции в серии 2, измените некоторые стили».Zingchart: Целевая множественная серия в правиле с использованием токенов

Zingchart конфигурации:

var config = { 
    // ... 
    'type': 'area', 
    'plot': { 
    'rules': [ 
     { 
     'rule': '', // %v from series 1 > %v from series 2 
     'background-color': '#ccc' 
     } 
    ] 
    }, 
    'series': [ 
    { 
     'text': 'Series 1', 
     'values': [36, 40, 38, 47, 49, 45, 48, 54, 58, 65, 74, 79, 85, 83, 79, 71, 61, 55] 
    }, 
    { 
     'text': 'Series 2', 
     'values': [40, 40, 40, 50, 50, 50, 50, 60, 60, 80, 80, 80, 80, 80, 80, 80, 60, 60] 
    } 
    ] 
}

Если это не возможно, есть другой способ добиться того же результата? Я стараюсь изменить стиль отдельной точки, когда значение серии 1 больше значения сериала 2.

источник

2015-10-15 Tom Fairbairn

В это время написания (v2.1.4 и ниже) невозможно применить логику правил для разных значений ряда. Наилучший способ приблизиться к этому - связать массив значений каждой серии в каждом объекте серии с «данными» в качестве значения ключа. (См. Ниже рабочий пример).

С учетом сказанного я отправил билет, чтобы изучить внедрение перекрестной логики в синтаксисе правил! - Я нахожусь в команде разработчиков на ZingChart, не стесняйтесь обращаться к другим вопросам.

var ruleSet = 
 
[ 
 
    //Controls the series 0 coloring 
 
    { 
 
    rule : "%data-series-1 > %v", 
 
\t backgroundColor : "#007c9b", 
 
     borderColor : "#006a84", 
 
     size : "8px" 
 
    }, 
 
    
 
    //Controls the series 1 coloring 
 
    { 
 
     rule : "%data-series-0 > %v", 
 
     backgroundColor : "#188f00", 
 
     borderColor : "#188f00", 
 
     size : "8px" 
 
    } 
 
]; 
 
    
 
var series0Values = [10,10,20,10,10,10,10,10]; 
 
var series1Values = [20,20,10,20,20,20,20,20]; 
 
    
 
var myConfig = { 
 
    \t type: "scatter", 
 
    \t plot :{ 
 
    \t marker : { 
 
    \t  rules : ruleSet 
 
    \t } 
 
    \t }, 
 
\t series : [ 
 
\t \t { 
 
\t \t \t values : series0Values, 
 
\t \t \t "data-series-1" : series1Values, 
 
\t \t \t marker : { 
 
\t \t  backgroundColor : "#00c0ef", 
 
     borderColor : "#00c0ef" 
 
\t \t } 
 
\t \t }, 
 
\t \t { 
 
\t \t \t values : series1Values, 
 
\t \t \t "data-series-0" : series0Values, 
 
\t \t \t marker : { 
 
\t \t  backgroundColor : "#26de00", 
 
     borderColor : "#26de00" 
 
\t \t } 
 
\t \t }, 
 
\t \t 
 
\t ] 
 
}; 
 

 
zingchart.render({ 
 
\t id : 'myChart', 
 
\t data : myConfig, 
 
\t height: 400, 
 
\t width: 400 
 
});

<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <script src= "https://cdn.zingchart.com/zingchart.min.js"></script> 
 
\t \t <script> zingchart.MODULESDIR = "https://cdn.zingchart.com/modules/"; 
 
\t </head> 
 
\t <body> 
 
\t \t <div id='myChart'></div> 
 
\t </body> 
 
</html>

источник

2015-10-15 18:21:22

Я закончил тем, пытаясь что-то, участвующих делает сравнение стоимости до рендеринга диаграммы, а затем с помощью 'выбранный-state' со статическим' selection' массива. Это выглядит намного эффективнее. Тем не менее, мне интересно, как я могу использовать описанный выше метод для того, чтобы создать фоновый цвет области графика за одной точкой на области или линейной диаграмме. Это не тот маркер, который я хочу создать, но, согласно документам, я не могу определить 'rules' непосредственно на' plot'. [Пример] (http://i.imgur.com/39LWOLN.png) –

Ничего - вы действительно можете определить 'rules' непосредственно на' plot'. Задача решена. –

Zingchart: Целевая множественная серия в правиле с использованием токенов

ответ

Смежные вопросы