Line Chart with Int as x axis, not Date - morris.js

I would like to display a chart which shows integers on the x axis instead of dates.
Here is a fiddle of the example:
http://jsfiddle.net/cs3vigny/srmqcfjh/
new Morris.Line({
element: 'film-compare-chart',
data: [
{ week: 0, a: 2, b: 4, c: 5, d: 3, e: 3 },
{ week: 1, a: 2, b: 3, c: 6, d: 3, e: 3 },
{ week: 2, a: 3, b: 5, c: 4, d: 2, e: 2 },
{ week: 3, a: 3, b: 6, c: 6, d: 3, e: 4 },
{ week: 4, a: 4, b: 4, c: 5, d: 4, e: 2 },
{ week: 5, a: 4, b: 6, c: 6, d: 3, e: 2 },
{ week: 6, a: 4, b: 7, c: 8, d: 5, e: 2 },
{ week: 7, a: 3, b: 5, c: 6, d: 5, e: 4 },
{ week: 8, a: 4, b: 8, c: 6, d: 4, e: 3 },
{ week: 9, a: 6, b: 10, c: 8, d: 7, e: 5 },
{ week: 10, a: 5, b: 12, c: 13, d: 7, e: 4 },
{ week: 11, a: 6, b: 10, c: 10, d: 7, e: 4 },
{ week: 12, a: 9, b: 10, c: 10, d: 10, e: 6 },
{ week: 13, a: 11, b: 15, c: 16, d: 12, e: 9 },
{ week: 14, a: 14, b: 15, c: 14, d: 13, e: 10 },
{ week: 15, a: 14, b: 20, c: 17, d: 15, e: 11 },
{ week: 16, a: 18, b: 26, c: 22, d: 16, e: 15 },
{ week: 17, a: 19, b: 22, c: 22, d: 18, e: 13 },
{ week: 18, a: 19, b: 21, c: 25, d: 20, e: 16 },
{ week: 19, a: 26, b: 26, c: 33, d: 24, e: 21 },
{ week: 20, a: 26, b: 26, c: 31, d: 24, e: 21 },
{ week: 21, a: 24, b: 28, c: 41, d: 26, e: 22 },
{ week: 22, a: 33, b: 32, c: 40, d: 29, e: 28 },
{ week: 23, a: 34, b: 37, c: 51, d: 34, e: 32 }
],
xkey: 'week',
ykeys: ['a','b','c','d','e'],
labels: ['Cinderella (2015)', 'Maleficent', 'Oz: The Great and Powerful', 'Divergent', 'Big Hero 6']
});
Does Morris.js only display dates on the x-axis no matter what or can that be changed?

Try adding option parameter parseTime:false.

In Morrischart,if 'parseTime' set to false then it skip time/date parsing for X values, Otherwise it treating them as an equally-spaced series;the default value is parseTime:true..thats why you get confused..So could you please insert the below line of code
parseTime:false
sample code like as follows,
new Morris.Area({
------
parseTime:false,
------
});
Hope its works fine :-)

Related

Can the right column be fixed in the bootstrap-vue table?

I want right fixed columns in the bootstrap-vue table
but, the Sticky function in the document is only fixed to the left.
Is there a way to fix the right side or last columns?
I want both the left and right columns being fixed in place.
documnet : https://bootstrap-vue.org/docs/components/table#sticky-columns
<template>
<div>
<div class="mb-2">
<b-form-checkbox v-model="stickyHeader" inline>Sticky header</b-form-checkbox>
<b-form-checkbox v-model="noCollapse" inline>No border collapse</b-form-checkbox>
</div>
<b-table
:sticky-header="stickyHeader"
:no-border-collapse="noCollapse"
responsive
:items="items"
:fields="fields"
>
<!-- We are using utility class `text-nowrap` to help illustrate horizontal scrolling -->
<template #head(id)="scope">
<div class="text-nowrap">Row ID</div>
</template>
<template #head()="scope">
<div class="text-nowrap">
Heading {{ scope.label }}
</div>
</template>
</b-table>
</div>
</template>
<script>
export default {
data() {
return {
stickyHeader: true,
noCollapse: false,
fields: [
{ key: 'id', stickyColumn: true, isRowHeader: true, variant: 'primary' },
'a',
'b',
{ key: 'c', stickyColumn: true, variant: 'info' },
'd',
'e',
'f',
'g',
'h',
'i',
'j',
'k',
'l'
],
items: [
{ id: 1, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 2, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 3, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 4, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 5, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 6, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 7, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 8, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 9, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 },
{ id: 10, a: 0, b: 1, c: 2, d: 3, e: 4, f: 5, g: 6, h: 7, i: 8, j: 9, k: 10, l: 11 }
]
}
}
}
</script>
It's possible by overriding bootstrap's CSS with some of our own. First make sure the last column has the stickyColumn: true option plus whatever other options you want to give it:
...
'i',
'j',
'k',
{ key: "l", stickyColumn: true, isRowHeader: true, variant: "primary" },
This will ensure it has a classname we can easily select on. Apply styling that gives the last sticky column in the table an attribute of right: 0:
<style>
.b-table-sticky-column:last-child {
right: 0;
}
</style>
codesandbox example

Outliers in data

I have a dataset like so -
15643, 14087, 12020, 8402, 7875, 3250, 2688, 2654, 2501, 2482, 1246, 1214, 1171, 1165, 1048, 897, 849, 579, 382, 285, 222, 168, 115, 92, 71, 57, 56, 51, 47, 43, 40, 31, 29, 29, 29, 29, 28, 22, 20, 19, 18, 18, 17, 15, 14, 14, 12, 12, 11, 11, 10, 9, 9, 8, 8, 8, 8, 7, 6, 5, 5, 5, 4, 4, 4, 3, 3, 3, 3, 2, 2, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
Based on domain knowledge, I know that larger values are the only ones we want to include in our analysis. How do I determine where to cut off our analysis? Should it be don't include 15 and lower or 50 and lower etc?
You can do a distribution check with quantile function. Then you can remove values below lowest 1 percentile or 2 percentile. Following is an example:
import numpy as np
data = np.array(data)
print(np.quantile(data, (.01, .02)))
Another method is calculating the inter quartile range (IQR) and setting lowest bar for analysis is Q1-1.5*IQR
Q1, Q3 = np.quantile(data, (0.25, 0.75))
data_floor = Q1 - 1.5 * (Q3 - Q1)

This prime generating function using generateSequence in Kotlin is not easy to understand. :(

val primes = generateSequence(2 to generateSequence(3) {it + 2}) {
val currSeq = it.second.iterator()
val nextPrime = currSeq.next()
nextPrime to currSeq.asSequence().filter { it % nextPrime != 0}
}.map {it.first}
println(primes.take(10).toList()) // prints [2, 3, 5, 7, 11, 13, 17, 19, 23, 29]
I tried to understand this function about how it works, but not easy to me.
Could someone explain how it works? Thanks.
It generates an infinite sequence of primes using the "Sieve of Eratosthenes" (see here: https://en.wikipedia.org/wiki/Sieve_of_Eratosthenes).
This implementation uses a sequence of pairs to do this. The first element of every pair is the current prime, and the second element is a sequence of integers larger than that prime which is not divisible by any previous prime.
It starts with the pair 2 to [3, 5, 7, 9, 11, 13, 15, 17, ...], which is given by 2 to generateSequence(3) { it + 2 }.
Using this pair, we create the next pair of the sequence by taking the first element of the sequence (which is now 3), and then removing all numbers divisible by 3 from the sequence (removing 9, 15, 21 and so on). This gives us this pair: 3 to [5, 7, 11, 13, 17, ...]. Repeating this pattern will give us all primes.
After creating a sequence of pairs like this, we are finally doing .map { it.first } to pick only the actual primes, and not the inner sequences.
The sequence of pairs will evolve like this:
2 to [3, 5, 7, 9, 11, 13, 15, 17, 19, 21, 23, 25, 27, 29, ...]
3 to [5, 7, 11, 13, 17, 19, 23, 25, 29, ...]
5 to [7, 11, 13, 17, 19, 23, 29, ...]
7 to [11, 13, 17, 19, 23, 29, ...]
11 to [13, 17, 19, 23, 29, ...]
13 to [17, 19, 23, 29, ...]
// and so on

Appending numpy arrays using numpy.insert

I have a numpy array (inputs) of shape (30,1). I want to insert 31st value (eg. x = 2). Trying to use the np.insert function but it is giving me out of bounds error.
np.insert(inputs,b+1,x)
IndexError: index 31 is out of bounds for axis 0 with size 30
Short answer: you need to insert it at index b, not b+1.
The index you pass to np.insert(..) [numpy-doc], is the one where the element should be added. If you insert it at index 30, then it will be positioned last. Note that indexes are zero-based. So if you have an array with 30 elements, then the last index is 29. If you thus insert this at index 30, we get:
>>> a
array([ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,
17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29])
>>> np.insert(a,30,42)
array([ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,
17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 42])

Table and Sum function in Mathematica

I have a very simple question. I don't use Mathematica very often and I got stuck with one task. I need to compute this task:
T=5;
y (* it represents 54 numbers*);
h = 2;
c (*starting at 3, see below*);
Table[Sum[(y[[i]]*((i - c)/h)*((i - c)/h)), {i, T}]/
Sum[((i - c)/h)*((i - c)/h), {i, T}], {c, 3, 54, 2}]
I need to compute the "sum…/sum…" 26 times, where "c" starts at 3 and in another step it is (3+2)-> 5 and so on (e.g. 2 steps). I managed to implement this task with Table function.
The problem is, that I also need the "i" to go from 1 to 54, but in one step it should compute just 5 numbers: 1st computing i=1,2,3,4,5 ; 2nd computing i=3,4,5,6,7 and so on. In the sum function I implemented T as 5, so in first step everything is ok, but I have no idea how to create the loop where "i" overlaps like that. I hope that someone will understand my "great" explanation.
You could write T as c+2, but your table is too long, i.e.
z = Table[c, {c, 3, 54, 2}]
{3, 5, 7, 9, 11, 13, 15, 17, 19, 21, 23, 25, 27, 29, 31, 33, 35, 37, 39, 41, 43, 45, 47, 49, 51, 53}
z + 2
{5, 7, 9, 11, 13, 15, 17, 19, 21, 23, 25, 27, 29, 31, 33, 35, 37, 39, 41, 43, 45, 47, 49, 51, 53, 55}
So again, if you wrote T as c+2, (and minimum i as c-2) . . .
Table[Sum[(y[[i]]*((i - c)/h)*((i - c)/h)), {i, c - 2, c + 2}]/
Sum[((i - c)/h)*((i - c)/h), {i, c - 2, c + 2}], {c, 3, 54, 2}]
. . . you would need y to represent a list of 55 numbers, not 54.
For example, this works ok :-
y = Array[RandomInteger[10] &, 55];
Table[Sum[(y[[i]]*((i - c)/h)*((i - c)/h)), {i, c - 2, c + 2}]/
Sum[((i - c)/h)*((i - c)/h), {i, c - 2, c + 2}], {c, 3, 54, 2}]