force line chart to always connect points with line

Ajdija commented 7 years ago

Take this for example:

<!doctype html>
<meta charset="utf-8">
<script src="//d3plus.org/js/d3.js"></script>
<script src="//d3plus.org/js/d3plus.js"></script>
<div id="viz"></div>
<script>
  var sample_data = [
    {"year": 1991, "name":"alpha", "value": 29},
    {"year": 1992, "name":"alpha", "value": 18},
    {"year": 1993, "name":"alpha", "value": 2},
    {"year": 1994, "name":"alpha", "value": 7},
    {"year": 1991, "name":"beta", "value": 11},
    {"year": 1994, "name":"beta", "value": 54}
  ]
  var attributes = [
    {"name": "alpha", "hex": "#CC0000"},
    {"name": "beta", "hex": "#00CC00"}
  ]
  var visualization = d3plus.viz()
    .container("#viz")
    .data(sample_data)
    .type("line")
    .id("name")
    .y("value")
    .x("year")
    .attrs(attributes)
    .color("hex")
    .draw()
</script>

How to force connecting line between green points? ("beta" data) If there is no such option can I kindly request addition?

zastupailo commented 7 years ago

@Ajdija I think for now it's only possible to fill gaps in the axis with 0 values.

https://jsfiddle.net/0rv5fpf2/1/

Ajdija commented 7 years ago

@azastupailo unfortunately it is not acceptable solution. I will try to enforce this by custom wrapper for now... unless sb finds better way

Another solution I considered was computing approximated values and marking them with different colour + key.

d3plus / d3plus

force line chart to always connect points with line #591