Google Chart: weekly schedule - google-visualization

Any suggestions on how I can use Google Chart API to display a weekly schedule? For example, a store's hours of operation:
Sunday, 9am-5pm
Monday, 9am-9pm
Tuesday, 9am-9pm
Wednesday, 9am-9pm
Thursday, 9am-9pm
Friday, 9am-12nn, 3pm-9pm
Saturday, 9am-10pm
Looking for examples, code snippet, or general advice.

You could use a stacked bar chart with two plots.
Hours on the Y axis.
Week days on the X axis.
First bar chart has start times.
Second bar chart has end times (minus start times).
The trick: Make the color of the first bar chart the same as the chart background color so you can't see it. Then, you'll just see the second bar chart.
I would start with 24 hour time first. If you get that to work, you can replace the times with text labels (ie 2 PM).
Caveat: I haven't tried this.

Related

ChartJS Pannable time series data with last 24 hours if on the hour unit?

Here is the sandbox link: https://codesandbox.io/s/chartjs-plugin-zoom-touch-scroll-y-forked-6q5li4?file=/src/components/ChartLine.vue
I am trying to build a chart out of some time-series data that I have.
I have a picker to select the scale: hour, day, week, and month, and the data can span up to 4 months. I start on the hour scale, but a visual problem I have is that I initially want the chart to focus on the last n hours/days/weeks instead of the current behavior where the chart shows the entire x-axis so the hour unit doesn't really make sense without tooltips.
How can I set limits using a UNIX timestamp of the min and max, and have the chart initially focus on the last n units? Like the last 4 hours or 4 days or 4 weeks or 4 months?

creating bar chart for a month but only showing data from 13:00:00 to 17:00:00 elasticsearch kibana

I am using elasticsearch version 7.1 in AWS.
I've created a bar chart where x-axis is using date histogram aggregation in 4h interval.
Below is my bar chart, sorry for inputting picture but I've figured it is best way to represent what I have and what I want to do.
Each bar takes 4hour interval worth of data and adds it up from given period Jan-31 to Feb-02. For given interval I would like to show bars for only 13:00:00 ~ 17:00:00 therefore I have one bar for each day.
So from Jan-31 ~ Feb-02 I would have one bar for Jan-31 13:00:00 ~17:00:00, 2nd bar for Feb-01 13:00:00 ~ 17:00:00 and 3rd bar for Feb-02 13:00:00 ~17:00:00.
I found that I could use scripted field and add extra column called hour of day as said here https://discuss.elastic.co/t/kibana-filter-for-a-specific-time-range/105169/2 I have huge data so do not want to use scripted field.
Is there any other way?
Thanks in advance.

Stata bar charts with dates

I'm trying to create a bar chart with a time axis. This is the code that I'm using:
twoway (bar weeksum week)
The week variable is a time variable and has the format %td.
However, when I create the bar chart, the X axis does not follow the format specified for the week variable. Instead the X axis takes integer values. I was wondering whether there is a way to fix this.
I can't reproduce this in Stata 13.1. The format of the time variable is used by default on the time (horizontal) axis.
Here's a test script. Hint: You should learn to produce such reproducible examples yourself.
clear
input week weeksum
20093 16
20100 61
20107 34
20114 42
20121 24
end
format week %td
levelsof week, local(levels)
twoway bar weeksum week, base(0) barw(6) xla(`levels', noticks)

Google charts visualization: Timeline - full timestamp

Is there a way the hover state to show the full timestamp including year, month, day, hour and min? Something like 2013-Oct-06 13:32
At the moment the hover state shows different parts of the timestamp depending on the resolution of the graph.
Here are the docs for the visualization:
https://google-developers.appspot.com/chart/interactive/docs/gallery/timeline
I manage to think of workaround of this limitation.
What I did is to place the time string formatted exactly as I wanted to be as the bar label for the time period. Since the bar label is present on the first row of the tool-tip, this solves the issue very nicely.

Google Chart API - Stepped Line Chart

I'm trying to get a stepped line chart with Google Chart API. I've searched the docs and haven't found anything.
Here's an example I saw with Flot:
http://www.flotcharts.org/flot/examples/threshold/index.html
More info:
I'm trying to plot account balances over time. So, if there's a balance of $1,000 on Jan 1 and a balance of $2,000 on Feb 1, the google line chart displays a sloped line between Jan and Feb, which does not reflect the actual account balance accurately. I'd rather not plot more values (i.e. by adding the balance of $1,000 on Jan 31) but may have to if that's the only way...
In your example, if you plot the $1,000 on Feb 1 (ie the before and after values on the same date) you get a nice step. It's a work-around and there must be better solutions, but it's easy to implement and does give you what you're after visually.
Look into the following article:
https://developers.google.com/chart/interactive/docs/gallery/steppedareachart?hl=ru
and playground:
https://code.google.com/apis/ajax/playground/?type=visualization#stepped_area_chart