Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

149
Views
Define color for specific pie slice (last index) in google chart as red

Context: I have a pie chart with dynamic slices (the user can add as many slices as they please) and I'd like to keep the last pie slice (called Loss) as red (this pie slice would essentially be the last index).

var data = new google.visualization.DataTable();
  data.addColumn("string", "Ativo");
  data.addColumn("number", "Quota");
  data.addRows([
    ...slices.map((slice) => [slice.ativo, slice.quota]),
    ["Loss", perda],
  ]);

  console.log(data);
  //Styling
  let options = {
    legend: "right",
    pieHole: 0.5,
    legend: { textStyle: { color: "gray" } },
    pieSliceText: "value",
    slices: {
      0: { color: "red" }, //I want this to pass the last index dynamically (as the user addes new elements, it updates to be the last index). As of now, this will give color red to the 1st element
    },
    colors: ["#728FCE", "#FBB117", "#6AA121", "#4863A0", "#7D0552", "#FF0000"],
    backgroundColor: "#22252a",
    chartArea: {
      left: 50,
      right: 50,
      top: 70,
    },
    width: "100%",
    height: "500px",
  };

  var chart = new google.visualization.PieChart(
    document.getElementById("piechart")
  );

  chart.draw(data, options);
}

I've tried this SO: Google Visualization - Set Pie Chart Slice Color, but no success.

I would basically want to change the slices object inside the options variable so that it would be something like this

slices: {
   data[data.lenght-1]: {color:"red"}
}

but this doesn't work. It seems as if it only accepts 0,1,2,3, etc. I've tried creating the number of elements added by the user, saving that as a variable and then pass that variable onto the slices object to set the color (so if the user added 2 elements, the variable would have integers from 0,1 and 2 and the last value (2) would server as index to be set as color red), but no success.

Or somehow fix the Loss row as being color red

Any help?

Thanks

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!