@millistream/millistream-widgets 0.0.8 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +116 -0
- package/millistream-widgets.js +4 -1
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
# Millistream Widgets
|
|
2
|
+
Millistream financial data widgets for websites.
|
|
3
|
+
|
|
4
|
+
## Installation
|
|
5
|
+
```bash
|
|
6
|
+
$ npm install @millistream/millistream-widgets
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
## Angular example
|
|
10
|
+
```html
|
|
11
|
+
<button (click)="loadChart()">Load</button>
|
|
12
|
+
<div id="chart" style="millistream-chart-target"></div>
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
```js
|
|
16
|
+
...
|
|
17
|
+
loadChart) {
|
|
18
|
+
(async function () {
|
|
19
|
+
const { Milli_List } = await import('@millistream/millistream-widgets');
|
|
20
|
+
|
|
21
|
+
let ml = new Milli_Chart({
|
|
22
|
+
instrument: [6485],
|
|
23
|
+
target: document.getElementById('chart'),
|
|
24
|
+
token: '5b09a1bb-3f27-4026-8c08-0acc9ef7a872',
|
|
25
|
+
autodraw: true,
|
|
26
|
+
intradaylen: '5',
|
|
27
|
+
historylen: '5y',
|
|
28
|
+
gridHorizontalLines: 0,
|
|
29
|
+
gridHorizontalLinesStyle: 'normal',
|
|
30
|
+
gridVerticalLines: 1,
|
|
31
|
+
chartlen: '1y',
|
|
32
|
+
dateformat: 'b dd',
|
|
33
|
+
drawyaxis: true,
|
|
34
|
+
fillchart: true,
|
|
35
|
+
timeformat: 'HH:mm',
|
|
36
|
+
/*streaming: pushapi*/
|
|
37
|
+
});
|
|
38
|
+
})();
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
```css
|
|
43
|
+
/* Global Styles */
|
|
44
|
+
.millistream-chart-target {
|
|
45
|
+
position: relative;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.millistream-chart-target {
|
|
49
|
+
position: relative;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.millistream-chart {
|
|
53
|
+
margin-bottom: 30px;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.millistream-chart-instrument {
|
|
57
|
+
color: #f90;
|
|
58
|
+
background-image: linear-gradient(
|
|
59
|
+
rgba(255, 153, 0, 0.6),
|
|
60
|
+
rgba(255, 153, 0, 0)
|
|
61
|
+
);
|
|
62
|
+
width: 2px;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.millistream-chart-tooltip {
|
|
66
|
+
position: absolute;
|
|
67
|
+
background: #ffffff;
|
|
68
|
+
border: 1px solid lightblue;
|
|
69
|
+
border-radius: 2px;
|
|
70
|
+
font-family: Arial, Helvetica, sans-serif;
|
|
71
|
+
font-size: 11px;
|
|
72
|
+
padding: 2px;
|
|
73
|
+
height: 14px;
|
|
74
|
+
pointer-events: none;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.millistream-chart-pointer {
|
|
78
|
+
width: 5px;
|
|
79
|
+
height: 5px;
|
|
80
|
+
border-radius: 50%;
|
|
81
|
+
box-shadow: 0px 0px 10px 2px #f90;
|
|
82
|
+
pointer-events: none;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.millistream-chart-x-legend {
|
|
86
|
+
font-family: Arial, Helvetica, sans-serif;
|
|
87
|
+
font-size: 11px;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.millistream-chart-y-legend {
|
|
91
|
+
font-family: Arial, Helvetica, sans-serif;
|
|
92
|
+
font-size: 11px;
|
|
93
|
+
float: left;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.millistream-chart-y2-legend {
|
|
97
|
+
font-family: Arial, Helvetica, sans-serif;
|
|
98
|
+
font-size: 11px;
|
|
99
|
+
float: right;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
.millistream-chart-zoombox {
|
|
103
|
+
position: absolute;
|
|
104
|
+
background: rgb(255, 153, 0, 0.1);
|
|
105
|
+
pointer-events: none;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
...
|
|
109
|
+
|
|
110
|
+
|
|
111
|
+
## Widget documentation
|
|
112
|
+
Please refer to non npm-version documentation on widget customization.
|
|
113
|
+
https://widgets.millistream.com/3.0.3/doc/widgets.html
|
|
114
|
+
|
|
115
|
+
## Support
|
|
116
|
+
https://www.millistream.com
|
package/millistream-widgets.js
CHANGED
|
@@ -900,7 +900,7 @@ function Milli_Chart(settings) {
|
|
|
900
900
|
nextYear = currentDate.getFullYear() + 1;
|
|
901
901
|
}
|
|
902
902
|
}
|
|
903
|
-
oldx = p.x;
|
|
903
|
+
//oldx = p.x; används inte tydligen
|
|
904
904
|
p.x = Math.round(parseInt(m_chartCss['margin-left']) + ((currentDate.getTime() - _this.scaleinfoX.startDate.getTime()) / _this.scaleinfoX.timePerPixel) - offset);
|
|
905
905
|
var datum;
|
|
906
906
|
var dash = false;
|
|
@@ -1407,6 +1407,7 @@ function Milli_Chart(settings) {
|
|
|
1407
1407
|
color = m_instrumentCss[k].color;
|
|
1408
1408
|
m_toolTip.arrowDiv[k].style.backgroundColor = color;
|
|
1409
1409
|
m_toolTip.arrowDiv[k].style.boxShadow = '0px 0px 17px 7px ' + color;
|
|
1410
|
+
m_toolTip.arrowDiv[k].style.pointerEvents = 'none';
|
|
1410
1411
|
}
|
|
1411
1412
|
if (posy > highy) highy = posy;
|
|
1412
1413
|
if (posy < lowy) lowy = posy;
|
|
@@ -2556,6 +2557,7 @@ var millistream_data_api = {
|
|
|
2556
2557
|
evalJSONP: function(callback, fn) {
|
|
2557
2558
|
return function(data) {
|
|
2558
2559
|
delete window[fn];
|
|
2560
|
+
var elem;
|
|
2559
2561
|
(elem = document.getElementById(fn)).parentNode.removeChild(elem);
|
|
2560
2562
|
if (typeof data == "object") {
|
|
2561
2563
|
callback(data);
|
|
@@ -5105,4 +5107,5 @@ function MillistreamWidgetStreamingApi(settings) {
|
|
|
5105
5107
|
milli_stream_connect();
|
|
5106
5108
|
}
|
|
5107
5109
|
exports.Milli_Chart = Milli_Chart;
|
|
5110
|
+
exports.MillistreamWidgetSettings = MillistreamWidgetSettings;
|
|
5108
5111
|
exports.MillistreamWidgetStreamingApi = MillistreamWidgetStreamingApi;
|