---

name: Control text orientation inside Pie slices

language: plotly_js

suite: pie

order: 5

sitemap: false

arrangement: horizontal

markdown_content: |

The [insidetextorientation](https://plot.ly/javascript/reference/#pie-insidetextorientation) attribute controls the orientation of the texts inside slices. With 'auto' the texts may automatically be rotated to fit with the maximum size inside the slice. The other three options 'horizontal', 'radial', and 'tangential' forces text to be horizontal, radial, and tangential.

---

var data = [{

type: "pie",

values: [2, 3, 4, 4],

labels: ["Wages", "Operating expenses", "Cost of sales", "Insurance"],

textinfo: "label+percent",

insidetextorientation: "radial"

}]

var layout = [{

height: 700,

width: 700

}]

Plotly.newPlot('myDiv', data, layout)

---

name: Control text orientation inside Sunburst slices

language: plotly_js

suite: sunburst

order: 6

sitemap: false

arrangement: horizontal

markdown_content: |

The [insidetextorientation](https://plot.ly/javascript/reference/#sunburst-insidetextorientation) attribute controls the orientation of the texts inside chart sectors. When set to 'auto' the texts may automatically be rotated to fit with the maximum size inside a sector. The other three options 'horizontal', 'radial', and 'tangential' first try to orient text at the 3:00, 6:00, 9:00, and 12:00 hours. If there is no enough room, then the text would be positioned in the middle of the arc.

---

Plotly.d3.csv('https://raw.githubusercontent.com/plotly/datasets/master/coffee-flavors.csv', function(err, rows){

function unpack(rows, key) {

return rows.map(function(row) {return row[key]})

}

var data = [{

type: "sunburst",

maxdepth: 2,

ids: unpack(rows, 'ids'),

labels: unpack(rows, 'labels'),

parents: unpack(rows, 'parents'),

textposition: 'inside',

insidetextorientation: 'radial'

}]

var layout = {margin: {l: 0, r: 0, b: 0, t:0}}

Plotly.newPlot('myDiv', data, layout)

})