CARVIEW |
Select Language
HTTP/2 200
accept-ranges: bytes
access-control-allow-origin: *
age: 0
cache-control: max-age=600
content-encoding: gzip
content-type: text/html; charset=utf-8
date: Tue, 14 Oct 2025 21:23:47 GMT
etag: W/"68e952e4-9200"
expires: Tue, 14 Oct 2025 21:33:47 GMT
last-modified: Fri, 10 Oct 2025 18:39:32 GMT
server: Vercel
strict-transport-security: max-age=63072000
vary: Accept-Encoding
via: 1.1 varnish
x-cache: MISS
x-cache-hits: 0
x-fastly-request-id: 302e4154ebb2c461306763b554d86747fe90bd82
x-github-request-id: 8398:26F72F:EDD1B:118C71:68EEBF60
x-origin-cache: HIT
x-proxy-cache: MISS
x-robots-tag: index
x-served-by: cache-bom-vanm7210024-BOM
x-timer: S1760477028.551810,VS0,VE288
x-vercel-cache: MISS
x-vercel-id: bom1::qdg5n-1760477027520-2dcea01625ce
content-length: 8989
Text template in JavaScript
Text Template in JavaScript
How to use D3.js-based text template in Plotly.js.
Plotly Studio: Transform any dataset into an interactive data application in minutes with AI. Try Plotly Studio now.
To show an arbitrary text in your chart you can use texttemplate, which is a template string used for rendering the information, and will override textinfo.
var data = [{
type: "pie",
values: [2, 5, 3, 2.5],
labels: ["R", "Python", "Java Script", "Matlab"],
texttemplate: "%{label}: %{value} (%{percent})",
textposition: "inside"
}];
Plotly.newPlot("myDiv", data)
The following example uses textfont to customize the added text.
var data = [{
type: "scatterternary",
a: [3, 2, 5],
b: [2, 5, 2],
c: [5, 2, 2],
mode: "markers+text",
text: ["A", "B", "C"],
texttemplate: "%{text}<br>(%{a:.2f}, %{b:.2f}, %{c:.2f})",
textposition: "bottom center",
textfont:{'family': "Times", 'size': [18, 21, 20], 'color': ["IndianRed", "MediumPurple", "DarkOrange"]}
}];
Plotly.newPlot("myDiv", data)
The following example displays how to show date by setting axis.type in funnel charts.
var data = [{
type: 'funnel',
name: 'Montreal',
orientation: "h",
y: ["2018-01-01", "2018-07-01", "2019-01-01", "2020-01-01"],
x: [100, 60, 40, 20],
textposition: "inside",
texttemplate: "%{label}"
},{
type: "funnel",
name: 'Vancouver',
orientation: "h",
y: ["2018-01-01", "2018-07-01", "2019-01-01", "2020-01-01"],
x: [90, 70, 50, 10],
textposition: "inside",
textinfo: "label"}]
var layout = {yaxis: {type: 'date'}}
Plotly.newPlot("myDiv", data, layout)
