Community Tip - Stay updated on what is happening on the PTC Community by subscribing to PTC Community Announcements. X
Hi,
Can you let me know if there is any way to increase tooltip font size for Bar chart?
Thingworx 9.3.0
Thanks
Solved! Go to Solution.
Found solution :
PTCS-TOOLTIP-OVERLAY::part(tooltip-text){
font-size: 15px !important;
}
It works!
From "Help Center" - "Creating Custom Chart Tooltips": https://support.ptc.com/help/thingworx/platform/r9/en/index.html#page/ThingWorx/Help/Mashup_Builder/Widgets/CreatingCustomChartTooltips.html
I have checked the link above but couldnot find relevant information .Can you please help me further.
FYI,
I have found below html code in runtime relevant to tooltip of bar chart. Can you help me with css code from it?
html code :
<ptcs-style-unit wc="PTCS-TOOLTIP-OVERLAY" style="display: none;">
[part~=tooltip-text] {
font-family: "Open Sans",Arial,sans-serif;
font-weight: 400;
line-height: normal;
letter-spacing: normal;
font-stretch: normal;
color: #FFF;
font-size: 20px;
font-style: normal;
text-decoration: none;
}
:host([_icon]) [part~=tooltip-text] {
padding: 8px 8px 8px 0px;
}
:host(:not([_icon])) [part~=tooltip-text] {
padding: 8px;
}
[part~=tooltip-icon] {
fill: #FFF;
}
:host {
max-width: 335px;
}
[part~=pointer] {
height: 8px;
width: 14px;
--ptcs-tooltip-pointer-edge-offset: 8px;
--ptcs-tooltip-pointer-shift: -7px;
stroke-width: 1;
stroke: #14222D;
fill: #14222D;
}
[part~=tooltip] {
background: #14222D;
border-color: #14222D;
color: #FFF;
box-shadow: 0px 0px 0px 0px #000000;
border-width: 0px;
border-style: none;
border-radius: 0px;
}
[part~=truncation-overflow] {
margin-bottom: 12px;
}
[part~=title] {
font-size: larger;
padding-bottom: 0.3em;
margin-bottom: 0.5em;
border-bottom: solid 1px #adb5bd;
font-weight: 700;
}
</ptcs-style-unit>
when I changed [part~=tooltip-text] font size property,tootip size increased.I have give custom css like below.
ptcs-style-unit::part(tooltip-text){
font-size: 20px !important;
}
Am I doing anything wrong here?
Found solution :
PTCS-TOOLTIP-OVERLAY::part(tooltip-text){
font-size: 15px !important;
}
It works!