Hi,
I am trying to draw those 4 triangle shapes in a ternary plot , with different colors, but I have never used svg paths and I am finding it difficult to find out how to draw them.
var layout = {
//force specific plot size
autosize: false,
width: 700,
height: 700,
paper_bgcolor: '#fff',
ternary: {
sum: 100,
aaxis: makeAxis('A', 0,'Yellow'),
baxis: makeAxis('<br>B', 45,'Green'),
caxis: makeAxis('<br>C', -45,'Red'),
bgcolor: '#FFFFFF'
},
shapes: [
{
editable: false,
type: 'path',
path: 'M .1 .1 L .1 .3 L .4 .1 Z',
fillcolor: 'rgba(44, 160, 101, 0.5)',
line: {
color: 'rgb(44, 160, 101)'
},
opacity: 0.5
}, {
editable: false,
type: 'path',
path: 'M .5 .5 L .1 .3 L .4 .1 Z',
fillcolor: 'rgba(255, 191, 0, 0.5)',
line: {
color: 'rgb(255, 191, 0)'
},
opacity: 0.5
}],
annotations: [{
//arrowside: 'end+start',
//arrowcolor: 'rgba(26, 66, 26, 1)',
//arrowhead: 2,
showarrow: false,
text: 'Ternary Plot',
xanchor: 'left',
yanchor: 'bottom',
x: 0.0,
y: 1.05,
font: {
family: 'Arial',
size: 30,
color: 'rgb(37,37,37)'
},
}],
paper_bgcolor: '#FFFFFF',
};
Any points in the right direction will be great. Thanks