A value that is used to indicate whether to show and what to show on the open tooltip.
Type: Function
hint:{
enable:true,
content:null,
contentStyle: {
fill: "#d1d1d1","font-size": 16
},
title:null,
titleStyle: {
fill: "#d1d1d1","font-size": 16
},
style: {
fill: "270-#333333-#000000",
"stroke-width": "2"
},
animated: "fade",
showAnimated: "fade",
hideAnimated: "fade",
duration: 120,
showDuration: 120,
hideDuration: 120,
showDelay: 150,
hideDelay: 150,
easing: "",
showEasing: "",
hideEasing: "",
compass:"north",
offsetX: 0,
offsetY: 0,
showCallout: true,
calloutFilled: false,
calloutFilledStyle: {
fill: "#000"
}
}
animated
A value that indicates the effect during show or hide when showAnimated or hideAnimated is not specified.
Type: String
Default: "fade"
calloutFilled
A value that determines whether to fill the callout. If true, thenthe callout triangle will be filled.
Type: Boolean
Default: false
calloutFilledStyle
A value that indicates the style applied to the filled callout. For a full list of style options, please see the Stype Options topic.
Type: object
Default: {fill: "#000"}
compass
A value that indicates the compass position of the tooltip.
Type: String
Default: "north"
Notes: Options are 'west', 'east', 'south', 'north', 'southeast', 'southwest', 'northeast', and 'northwest'.
content
The content value can be either a string or a function. If it is a string, then the value set for the string will appear in the content part of the tooltip. If it is a function, then the function will get a value for the content part of the tooltip.
A function will resemble one of the following samples:
WinJS.UI.setOptions(document.getElementById("wijbarchart").winControl, {
hint: {
content: function () {
return this.data.label + '\n ' + this.y + '';
}
},
Or
var barchart = document.getElementById("wijbarchart").winControl,{
barchart.hint.content = function () {
return this.data.label + '\n ' + this.y + '';
};
}
Type: String or Function
Default: ""
contentStyle
A value that indicates the style that will be applied to the tooltip content text. For a full list of style options, please see the Stype Options topic.
Type: Object
Default: {fill: "#d1d1d1", "font-size":16}
duration
A value that indicates the number of milliseconds to show or hide the tooltip when the showDuration or hideDuration property is not specified.
Type: Number
Default: 120
easing
Sets the animation easing effect that the user experiences when the chart loads. For example, a user can have the wijbarchart bars bounce several times as they load.
Type: String
Default: ""
Values available for the animation easing effect include the following:
• "linear" – The animated item's velocity is steady as it moves from one point to another.
• "<" or "easeIn" – Begins at full velocity and decelerates
• ">" or "easeOut" – Begins at zero velocity and accelerates
• "<>" or "easeInOut" – Begins at full velocity until halfway and then slows. After the halfway point, it accelerates again.
• "backIn" – Moves back before reaching full velocity.
• "backOut" – Begins at full velocity, passes the end point, and then moves back.
• "elastic" – Begins at full velocity and decelerates, moves beyond the end point, and then snaps back.
• "bounce" - Begins at full velocity and decelerates until it reaches the end point and bounces. With a longer duration, the item being animated will bounce more.
enable
A value that indicates whether to show the tooltip.
Type: Boolean
Default: true
hideAnimated
A value that indicates the effect applied to the tooltip during hide.
Type: String
Default: "fade"
hideDelay
A value that indicates the number of milliseconds to delay hiding the tooltip.
Type: Number
Default: 150
hideDuration
A value that indicates the number of milliseconds to hide the tooltip.
Type: Number
Default: 120
hideEasing
A value that indicates the easing effect applied to the tooltip during hide. The available easing options are the same as those in the easing option.
Type: String
Default: ""
offsetX
A value that indicates the horizontal offset of the point to show the tooltip.
Type: Number
Default: 0
offsetY
A value that indicates the vertical offset of the point to show the tooltip.
Type: Number
Default: 0
showAnimated
A value that indicates the animation effect during the show event.
Type: String
Default: true
showCallout
A value that determines whether to show the callout element.
Type: Boolean
Default: true
showDelay
A value that indicates the number of milliseconds to delay showing the tooltip.
Type: Number
Default: 150
showDuration
A value that indicates the number of milliseconds to show the tooltip.
Type: Number
Default: 120
showEasing
A value that indicates the easing effect applied to the tooltip during the show event. The available easing options are the same as those in the easing option.
Type: String
Default: ""
style
A value that indicates the styles applied to the container. For a full list of style options, please see the Stype Options topic.
Type: Object
Default: {fill: "#000000", "stroke-width": "2"}
title
A value that will be shown in the title part of the tooltip or a function which is used to get a value for the tooltip shown.
Type: String or Function
Default: null
titleStyle
A value that indicates the style applied to the title text. For a full list of style options, please see the Stype Options topic.
Type: Object
Default: {fill: "#d1d1d1", "font-size": 16}
Code Example:
WinJS.UI.setOptions(document.getElementById("wijbarchart").winControl, {
hint: {
content: function () {
returnthis.data.label + '\n ' + this.y + '';
}
});