Home Forums Chart Support Line Chart Connector Colors

Line Chart Connector Colors

Viewing 2 posts - 1 through 2 (of 2 total)
  • #34860

    Good day! Tell me a way to create a graph in the attached image. It is necessary that the connecting lines of the points have certain colors. Suppose if points 1 and 2 are connected, then their connecting line is blue, let’s say if points 2 and 1 are connected, then their color is red. Is it possible to make the specified line color for connecting even dots 0-2-4-6-8-0 blue and 0-1-3-5-7-9-0 blue, and for lines 0-9-8-7- 5-3-1-0 and 0-8-6-4-2-0 red.The graph is dynamic. Example



    Can you please provide some sample data so that we can understand your scenario better and help you out?

    Based on the screenshot shared, you can easily achieve the requirement by setting the markerBorderThickness, markerColor, markerBorderColor, and lineColor as shown in the code snippet below –

        type: "line",
        markerBorderThickness: 2,
        markerColor: "white",
        dataPoints: [
          {x: 4, y: 10, markerBorderColor: "blue", lineColor: "blue"},
          {x: 9, y: 23, markerBorderColor: "blue", lineColor: "red"},
          {x: 16, y: 16, markerBorderColor: "red", lineColor: "blue"},
          {x: 12, y: 33, markerBorderColor: "blue", lineColor: "blue"},
          {x: 17, y: 44, markerBorderColor: "blue", lineColor: "red"}

    Also, please take a look at this JSFiddle for an example on same.

    Chart with customized dataPoints

    Indranil Deo
    Team CanvasJS

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.