График на amcharts

Question

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

Я пробовал указывать параметр connect: true. Но это все равно не сработало. Помогите мне сделать так, чтобы точки соединялись линиями.

Мой код:

am5.ready(function() {
  var root = am5.Root.new("chartdiv");

  root.setThemes([am5themes_Animated.new(root)]);

  var chart = root.container.children.push(am5xy.XYChart.new(root, {
    panX: true,
    panY: true,
    wheelX: "panX",
    wheelY: "zoomX",
    pinchZoomX: true,
    paddingLeft: 0
  }));

  var cursor = chart.set("cursor", am5xy.XYCursor.new(root, {
    behavior: "none"
  }));
  cursor.lineY.set("visible", false);

  var xAxis = chart.xAxes.push(am5xy.DateAxis.new(root, {
    maxDeviation: 0.2,
    baseInterval: {
      timeUnit: "second",
      count: 5
    },
    renderer: am5xy.AxisRendererX.new(root, {
      minorGridEnabled: true
    }),
    tooltip: am5.Tooltip.new(root, {})
  }));

  var yAxis = chart.yAxes.push(am5xy.ValueAxis.new(root, {
    renderer: am5xy.AxisRendererY.new(root, {
      pan: "zoom"
    })
  }));

  chart.set("scrollbarX", am5.Scrollbar.new(root, {
    orientation: "horizontal"
  }));

  function addDataToChart() {
    var jsonData = {};
    for (var i = 1; i <= 3; i++) {
      var randomNumber = Math.floor(Math.random() * 201);
      jsonData["k" + i] = randomNumber;
    }

    addData(jsonData);
  }

  function addData(data) {
    Object.keys(data).forEach(function(key) {
      var series = chart.series.push(am5xy.LineSeries.new(root, {
        name: key,
        xAxis: xAxis,
        yAxis: yAxis,
        valueYField: key,
        valueXField: "date",
        connect: true,
        tooltip: am5.Tooltip.new(root, {
          labelText: "{" + key + "}"
        })
      }));

      // Add data for the current k line
      series.data.setAll([{
        date: Date.now(),
        [key]: data[key]
      }]);
    });

    chart.appear(1000, 100);
  }

  addDataToChart();
  setInterval(addDataToChart, 5000);
});

#chartdiv {
  width: 100%;
  height: 500px;
  max-width: 100%;
}

<div id="chartdiv"></div>

<script src="https://cdn.amcharts.com/lib/5/index.js"></script>
<script src="https://cdn.amcharts.com/lib/5/xy.js"></script>
<script src="https://cdn.amcharts.com/lib/5/themes/Animated.js"></script>

БЛОГ НА HUSL

График на amcharts

Ответы (0 шт):