Как программно управлять стилем линии на графике js?

Question

Как вы можете видеть здесь, изменение стиля линии, если на осях X будущие даты. Кроме того, стиль линии меняется на «красный пунктир», если y слишком низок, а оси X пересекает будущие даты. Пожалуйста, помогите мне сделать это, используя реагирующий график js -2. Ниже того, чего я достиг до сих пор.

const data = {
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [
    {
      label: "My First dataset",
      fill: true,
      lineTension: 0.1,
      backgroundColor: "rgba(75,192,192,0.4)",
      borderColor: "rgba(75,192,192,1)",
      borderCapStyle: "butt",
      borderDash: [],
      borderDashOffset: 0.0,
      borderJoinStyle: "miter",
      pointBorderColor: "rgba(75,192,192,1)",
      pointBackgroundColor: "#fff",
      pointBorderWidth: 1,
      pointHoverRadius: 5,
      pointHoverBackgroundColor: "rgba(75,192,192,1)",
      pointHoverBorderColor: "rgba(220,220,220,1)",
      pointHoverBorderWidth: 2,
      pointRadius: 1,
      pointHitRadius: 10,
      data: [65, 59, 80]
    },
    {
      label: "My Second dataset",
      fill: true,
      lineTension: 0.1,
      backgroundColor: "rgba(210, 20, 212)",
      borderColor: "rgba(210, 211, 21)",
      borderCapStyle: "butt",
      borderDash: [],
      borderDashOffset: 0.0,
      borderJoinStyle: "miter",
      pointBorderColor: "rgba(210, 21, 1)",
      pointBackgroundColor: "#fff",
      pointBorderWidth: 1,
      pointHoverRadius: 5,
      pointHoverBackgroundColor: "rgba(75,192,192,1)",
      pointHoverBorderColor: "rgba(220,220,220,1)",
      pointHoverBorderWidth: 2,
      pointRadius: 1,
      pointHitRadius: 10,
      data: [81, 56, 55, 40]
    }
  ]
};

введите описание изображения здесь