@millistream/millistream-widgets 0.0.10 → 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 +3 -3
- 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;
|
|
@@ -2534,7 +2535,6 @@ function Milli_Chart(settings) {
|
|
|
2534
2535
|
});
|
|
2535
2536
|
|
|
2536
2537
|
}
|
|
2537
|
-
|
|
2538
2538
|
var milli_data_api_url = 'https://stage.millistream.com/widgets/3.0.3/data/milli_widget_dataapi.php?';
|
|
2539
2539
|
|
|
2540
2540
|
var millistream_data_api = {
|
|
@@ -4708,7 +4708,6 @@ var MillistreamWidgetSettings = {
|
|
|
4708
4708
|
thousandseparator: ' ',
|
|
4709
4709
|
streaming: false
|
|
4710
4710
|
};
|
|
4711
|
-
|
|
4712
4711
|
function MillistreamWidgetStreamingApi(settings) {
|
|
4713
4712
|
var _this = this;
|
|
4714
4713
|
_this.settings = {
|
|
@@ -5108,4 +5107,5 @@ function MillistreamWidgetStreamingApi(settings) {
|
|
|
5108
5107
|
milli_stream_connect();
|
|
5109
5108
|
}
|
|
5110
5109
|
exports.Milli_Chart = Milli_Chart;
|
|
5110
|
+
exports.MillistreamWidgetSettings = MillistreamWidgetSettings;
|
|
5111
5111
|
exports.MillistreamWidgetStreamingApi = MillistreamWidgetStreamingApi;
|