Это то, как далеко я проделал создание многоосевых линейных графиков с ямочками.Непонятно, почему серия y3
видна при сравнении ее диапазона с диапазоном y1
и y2
.Все еще экспериментирую ... не ставя под сомнение мудрость многоосевых линейных графиков на этом этапе.
Мой вопрос заключается в том, как выбрать конкретные цвета для трех серий (например, blue
, red
, green
) и добавьте соответствующую легенду, учитывая, что три addSeries
вызова связаны с group
.
Пробовал JSFiddle, но рендерингтам очень разные.
<div id="plotSO">
<script type="text/javascript">
var svg = dimple.newSvg("#plotSO",900, 500),
chart=null,
s1=null,
s2=null,
s3=null,
x=null,
y1=null,
y2=null,
y3=null;
chart = new dimple.chart(svg);
chart.setBounds(100, 100, 510, 305);
x = chart.addMeasureAxis("x", "group");
x.showGridlines = true;
x.overrideMin = 1;
y1 = chart.addMeasureAxis("y", "value");
y2 = chart.addMeasureAxis("y", "value");
y3 = chart.addMeasureAxis("y", "value");
s1 = chart.addSeries( "group", dimple.plot.line,[x,y1]);
s1.interpolation = "cardinal";
s1.lineMarkers=true;
s1.data=[{"group":1,"metric":"m1","value":112.5002},{"group":2,"metric":"m1","value":166.2608},{"group":3,"metric":"m1","value":164.3132}] ;
y1.title="y1-title";
s2 = chart.addSeries( "group", dimple.plot.line,[x,y2]);
s2.interpolation = "cardinal";
s2.lineMarkers=true;
s2.data=[{"group":1,"metric":"m2","value":155.4},{"group":2,"metric":"m2","value":162.4},{"group":3,"metric":"m2","value":152.9}] ;
y2.title="y2-title";
s3 = chart.addSeries( "group", dimple.plot.line,[x,y3]);
s3.interpolation = "cardinal";
s3.lineMarkers=true;
s3.data=[{"group":1,"metric":"m3","value":0.0451},{"group":2,"metric":"m3","value":0.0275},{"group":3,"metric":"m3","value":0.0226}] ;
y3.title="y3-title";
chart.draw();
</script>
</div>