I have include a jqueryUI Datepicker, I need to change the 2 letters days into 1 letter, example. instead of "Su" for Sunday, it will become "S" for sunday and the rest....
How will I change it???
I was just wondering this same thing. After looking through the api I found out you can pass an option into the datepicker to change the day names. Here is the api section:
http://api.jqueryui.com/datepicker/#option-dayNamesMin
Here is an example:
$("#datepicker").datepicker({
dayNamesMin: ['S', 'M', 'T', 'W', 'T', 'F', 'S']
});
Related
I have a dataset (csv) that renders into a line graph, there is also a tool tip that displays amongst other data, the date from the dataset. In chrome it works ok, but in IE (latest) and firefox 58, it is rendering the date as '01 Jan 1970'. I assume that if the date displays ok in Chrome, other browsers would follow suit.
This is my tooltip line:
<div class="tooltip-date">' + Highcharts.dateFormat('%d %b %Y', this.x) + '</div>
Has anyone any idea as to how to fix this?
The date in the csv is like so: 25-Jan-2016
I have the latest versions of highchart js and highcharts data module.
The value provided to Highcharts.dateFormat must be a timestamp as a number. From what I understand from your explanation the provided value is a 25-Jan-2016. You have to first parse the date either with Highcharts or before to be able to use the dateFormat function.
I have a scenario with jQuery datepicker where the user is editing an event that occurs in September, but the current month is June.
The user unselects all dates and the datepicker but the datepicker jumps back to June.
The required behaviour is that the datepicker stays in September, with no dates selected.
Is there a default parameter to handle this, without writing a custom handler in the onSelect hook?
There is no datepicker parameter to set a default month, you have to set it by default date option. Helpful link here
defaultDate
Type: Date or Number or String
Default: null
Set the date to highlight on first opening if the field is blank. Specify either an actual date via a Date object or as a string in the current dateFormat, or a number of days from today (e.g. +7) or a string of values and periods ('y' for years, 'm' for months, 'w' for weeks, 'd' for days, e.g. '+1m +7d'), or null for today.
Multiple types supported:
Date: A date object containing the default date.
Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.
Code examples:
Initialize the datepicker with the defaultDate option specified:
$( ".selector" ).datepicker({
defaultDate: +7
});
OR
$( ".selector" ).datepicker({ defaultDate: new Date() });
OR
$(function() {
$('.selector').datepicker( {
// ...
});
var default_date = new Date(2023, 10, 1);
$(".selector").datepicker("setDate", default_date);
});
I have a few years of sample data that I'd like to break at year end (12/31) of every year. Trying to implement this code from example from API
breaks: [{ // break on last day of year
from: Date.UTC(2008, 12, 31, 58),
to: Date.UTC(2008, 12, 31, 59),
repeat: 24 * 36e5 // not sure how to use this
}],
is there a way to ignore the year in Date.UTC()? Also I'd like to repeat this every year. Tied numerous combos to no avail. Heres my jsfiddle
Adding null value point will create a gap in a series plot if connectNulls is set to false (by default it is false).
Example: http://jsfiddle.net/c9e9ao2L/1/
I am using the jQuery datepicker in an application which will be used, among other things, to insert and update birth dates of employees. I find it cumbersome to have to click several times in order to get to the 70's and 80', decades in which many employees are born in. Is there a way to access these 'further' years in less clicks?
This is what my datepicker looks like
$("#DateOpened").datepicker({
dateFormat: "mm/dd/yy",
maxDate: "+0D",
showAnim: 'slide',
changeMonth: true,
changeYear: true,
'setDate': new Date(),
onClose: function (selectedDate) {
$("#DateClosed").datepicker("option", "minDate", selectedDate);
}
});
Use the yearRange option to increase the size of the year drop-down.
yearRange: "c-30:+0"
will allow selecting a year after 1983 in one click, and the 70's in 2 clicks.
FIDDLE
However, this isn't a good UI. When the user first clicks on the menu, it's not obvious that they can go back more than 30 years by first selecting an old year and then clicking on the menu again. You can use c-100:+0 to allow the menu to contain 100 years, hopefully this wil be enough for most users.
If I understood correctly, then yes it is possible using minDate and maxDate options. Here you can set the year that has to be shown.
changeYear: true,
minDate: '-1Y', //decrease 1 year from current year
maxDate: '+2Y' //increase 2 from current year
Y represent year.
This is one shortest way to reach the year soon.
I'm trying to get Highcharts to display the daily usage statistics for e.g. a company's ressource. The opening days of the company are from monday to friday.
My dataseries look like this:
[Date.UTC(2012, 8, 6),17.5], (Thu)
[Date.UTC(2012, 8, 7),42.5], (Fri)
-- weekend
[Date.UTC(2012, 8, 10),20], (Mon)
[Date.UTC(2012, 8, 11),20], (Tue)
[Date.UTC(2012, 8, 12),40], (Wed)
[Date.UTC(2012, 8, 13),30], (Thu)
...
In the time series chart there are inserted two labels for the missing two weekend-dates (2012, 8, 8 and 2012, 8, 9), but I don't want those labels to be displayed because there are no values for these labels and so the adjacent dates will be connected via a line but this is wrong.
Is it possible to turn off this 'date interpolation' and show only the values I've inserted?
Thanks with regards, Phil
It may be possible using a scatter series and customizing the tickPositioner callback for the x-axis and filtering of x series data (dates) thats not a weekday.
I've created a fiddle at http://jsfiddle.net/hkskoglund/6jNGg/
To allow for missing weekends days null should be pushed for the y-value in the series data (as mentioned in comment above)
Another option without using a datetime axis is to use a category axis where you push the dates in the series you have data for. This will allow to have a continous plot. Take a look at the new fiddle: Areaspline with categories as dates
xAxis: {
labels: {
formatter: function() {
// http://api.highcharts.com/highcharts#Highcharts.dateFormat()
return Highcharts.dateFormat('%d %b', this.value);
}
},
categories : [
Date.UTC(2012, 8, 6),Date.UTC(2012, 8, 7),
Date.UTC(2012, 8, 10),Date.UTC(2012, 8, 11),
Date.UTC(2012, 8, 11)]
},
series: [{
name : 'resources',
data: [17.5,42.5,20,25,20]
}]
As far as I can understand using datetime on the x-axis using your requested plot-configuration is not possible without changing the source/rendering of Highcharts series. It seems like discontinuties with null values is separated into socalled segments.
Have you tried to set oridinal as false?
http://api.highcharts.com/highstock#xAxis.ordinal
I know this is an old question, but did you try formatting your dates as Strings before inserting them? If so, you can then use a category axis. This should work as long as you don't have any entry for date vs having a null.
I use Highcharts embedded in JasperReports, but this allows us to get your desired behavior.