Google Charts饼图自定义颜色配置未生效技术问询
I see exactly what's going on here — your custom olive/khaki color palette isn't applying because of one tiny oversight in the chart.draw() call!
The Root Cause
You've properly defined your color preferences in the options object, but when you render the chart, you're passing null instead of the options variable. That tells Google Charts to ignore all your custom settings and stick to defaults.
Corrected Code
Here's the fixed version of your drawChart function, with the critical change highlighted:
google.charts.load('current', {packages: ['corechart']}); google.charts.setOnLoadCallback(drawChart); function drawChart() { work = <xsl:value-of select="$holidayPay"/>; //Yearly Netto Salary eat = <xsl:value-of select="$totalCost"/>; //odvody SS na sociální a zdravotní pojištění commute = <xsl:value-of select="$yearlyBonusPayment"/>; //Annual Bonus tv = <xsl:value-of select="$pensionContribution"/>+<xsl:value-of select="$cafeteriaContribution"/>+<xsl:value-of select="$lunchContribution"/>+<xsl:value-of select="$customField2"/>+<xsl:value-of select="$Referral"/>; //Benefits Contribution tc = <xsl:value-of select="$travelPay"/>+<xsl:value-of select="$sicknessPay"/>+<xsl:value-of select="$TrainingCosts"/>; //Training Costs var data = google.visualization.arrayToDataTable([ ['Task', 'Hours per Week'], ['Yearly Netto Salary', work], ['Look, what the state has stolen from your payslip', eat], ['Annual Bonus', commute], ['Benefits Contribution', tv], ['Training Costs', tc], ]); var options = { //title: 'Weekly Activities', colors: ['olive','darkolivegreen','khaki','darkkhaki','cornsilk'] }; var chart = new google.visualization.PieChart(document.getElementById('piechart')); // Changed null to options here! chart.draw(data, options); }
What Changed?
- The line
chart.draw(data, null);is nowchart.draw(data, options); - This passes your custom configuration (including the color palette) to the chart renderer, so it will use your olive/khaki tones instead of the default colors.
Your colors array is already perfectly set up to use the exact shades you want: olive, darkolivegreen, khaki, darkkhaki, and cornsilk — once you make this change, the pie chart sectors should render with those colors as expected.
内容的提问来源于stack exchange,提问作者Monika Juráková

