Related
I don't understand how to fill the array with a map() with the one difference:
I have array which is filled with a template like :
const templateOfRanks = {
rankingElementsTemplate : [
{row : [1.1, 1.2, 1.3, 1.4]},
{row : [2.1, 2.2, 2.3, 2.4, 2.5, 2.6, 2.7, 2.8, 2.9]},
{row : [3.1, 3.2, 3.3, 3.4]},
]
}
Result
It looks like a dimensional array. How can I fill a new array without "rows"? I want to get an array with elements from this template but without nested elements.
It should look like: [ 1.1, 1.2, 1.3, 1.4, 2.1, 2.2, 2.3, 2.4, 2.5, 2.6, 2.7, 2.8, 2.9,3.1, 3.2, 3.3, 3.4]
Probably I should use the push() function, I don't know...but I need to have two arrays: the first one is dimensional and the second one is single.
Help me, please.
you can use flatMap
const templateOfRanks = {
rankingElementsTemplate : [
{row : [1.1, 1.2, 1.3, 1.4]},
{row : [2.1, 2.2, 2.3, 2.4, 2.5, 2.6, 2.7, 2.8, 2.9]},
{row : [3.1, 3.2, 3.3, 3.4]},
]
}
const flat = templateOfRanks.rankingElementsTemplate.flatMap(i => i.row);
console.log(flat);
The code below fails to render data. No exceptions are thrown. However, the same code does work when given only one of the two traces as shown in the second code segment. The only difference is calling
Plotly.newPlot(target_target, traces); // doesn't render
instead of:
Plotly.newPlot(target_target, trace0); // trace1 also works.
I'm a javascript noob so it's probably something wrong with my traces array, but it looks like the example code I looked at.
Code that doesn't work (complete):
<html>
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id='target' style="width:600px;height:450px;"></div>
<script>
var target_target = document.getElementById('target');
var trace0 =
[{
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.5, 1.5, 6.5, 14.5, 25.5, 39.5],
type: 'scatter'
}];
var trace1 =
[{
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.0, 1.0, 6.0, 14.0, 25.0, 39.0],
type: 'scatter'
}];
var traces = [ trace0, trace1 ];
Plotly.newPlot(target_target, traces);
</script>
</body>
</html>
Code that does work (complete):
<html>
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id='target' style="width:600px;height:450px;"></div>
<script>
var target_target = document.getElementById('target');
var trace1 =
[{
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.0, 1.0, 6.0, 14.0, 25.0, 39.0],
type: 'scatter'
}];
Plotly.newPlot(target_target, trace1);
</script>
</body>
</html>
The mistake you made was simply that the individual traces should be objects not array of a single object, all you need to do is to make this correction.
Before:
var trace0 =
[{
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.5, 1.5, 6.5, 14.5, 25.5, 39.5],
type: 'scatter'
}];
After:
var trace0 =
{
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.5, 1.5, 6.5, 14.5, 25.5, 39.5],
type: 'scatter'
};
Then these individual traces(objects) need to be grouped into an array and set in plotly.
var traces = [ trace0, trace1 ];
Plotly.newPlot(target_target, traces);
That is why the second example works, since the traces are received as an array of objects.
Please do refer the below example and check if your issue is resolved!
var target_target = document.getElementById('target');
var trace0 = {
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.5, 1.5, 6.5, 14.5, 25.5, 39.5],
type: 'scatter'
};
var trace1 = {
x: [1.0, 2.0, 3.0, 4.0, 5.0, 6.0],
y: [0.0, 1.0, 6.0, 14.0, 25.0, 39.0],
type: 'scatter'
};
var traces = [trace0, trace1];
Plotly.newPlot(target_target, traces);
<html>
<head>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id='target' style="width:600px;height:450px;"></div>
</body>
</html>
I've copied just the code in Highcharts demo, but this histogram does not appear and console says: "Highcharts error #13: www.highcharts.com/errors/13". It seems to have forgotten something, but i don't know what... Please help. Thanks!
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/histogram-bellcurve.js></script>
<script>
var data = [3.5, 3, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1, 3.7, 3.4, 3, 3,
4, 4.4, 3.9, 3.5, 3.8, 3.8, 3.4, 3.7, 3.6, 3.3, 3.4, 3, 3.4, 3.5, 3.4, 3.2,
3.1, 3.4, 4.1, 4.2, 3.1, 3.2, 3.5, 3.6, 3, 3.4, 3.5, 2.3, 3.2, 3.5, 3.8, 3,
3.8, 3.2, 3.7, 3.3, 3.2, 3.2, 3.1, 2.3, 2.8, 2.8, 3.3, 2.4, 2.9, 2.7, 2, 3,
2.2, 2.9, 2.9, 3.1, 3, 2.7, 2.2, 2.5, 3.2, 2.8, 2.5, 2.8, 2.9, 3, 2.8, 3,
2.9, 2.6, 2.4, 2.4, 2.7, 2.7, 3, 3.4, 3.1, 2.3, 3, 2.5, 2.6, 3, 2.6, 2.3,
2.7, 3, 2.9, 2.9, 2.5, 2.8, 3.3, 2.7, 3, 2.9, 3, 3, 2.5, 2.9, 2.5, 3.6, 3.2,
2.7, 3, 2.5, 2.8, 3.2, 3, 3.8, 2.6, 2.2, 3.2, 2.8, 2.8, 2.7, 3.3, 3.2, 2.8,
3, 2.8, 3, 2.8, 3.8, 2.8, 2.8, 2.6, 3, 3.4, 3.1, 3, 3.1, 3.1, 3.1, 2.7, 3.2,
3.3, 3, 2.5, 3, 3.4, 3];
Highcharts.chart('container', {
title: {
text: 'Highcharts Histogram'
},
xAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
yAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
series: [{
name: 'Histogram',
type: 'histogram',
xAxis: 1,
yAxis: 1,
baseSeries: 's1',
zIndex: -1
}, {
name: 'Data',
type: 'scatter',
data: data,
id: 's1',
marker: {
radius: 1.5
}
}]
});
</script>
<div id="container" height="400px" width="800px"></div>
The only problem I see is that you are missing a double quote in your second <script> tag. Otherwise, it seems to work fine.
var data = [3.5, 3, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1, 3.7, 3.4, 3, 3,
4, 4.4, 3.9, 3.5, 3.8, 3.8, 3.4, 3.7, 3.6, 3.3, 3.4, 3, 3.4, 3.5, 3.4, 3.2,
3.1, 3.4, 4.1, 4.2, 3.1, 3.2, 3.5, 3.6, 3, 3.4, 3.5, 2.3, 3.2, 3.5, 3.8, 3,
3.8, 3.2, 3.7, 3.3, 3.2, 3.2, 3.1, 2.3, 2.8, 2.8, 3.3, 2.4, 2.9, 2.7, 2, 3,
2.2, 2.9, 2.9, 3.1, 3, 2.7, 2.2, 2.5, 3.2, 2.8, 2.5, 2.8, 2.9, 3, 2.8, 3,
2.9, 2.6, 2.4, 2.4, 2.7, 2.7, 3, 3.4, 3.1, 2.3, 3, 2.5, 2.6, 3, 2.6, 2.3,
2.7, 3, 2.9, 2.9, 2.5, 2.8, 3.3, 2.7, 3, 2.9, 3, 3, 2.5, 2.9, 2.5, 3.6, 3.2,
2.7, 3, 2.5, 2.8, 3.2, 3, 3.8, 2.6, 2.2, 3.2, 2.8, 2.8, 2.7, 3.3, 3.2, 2.8,
3, 2.8, 3, 2.8, 3.8, 2.8, 2.8, 2.6, 3, 3.4, 3.1, 3, 3.1, 3.1, 3.1, 2.7, 3.2,
3.3, 3, 2.5, 3, 3.4, 3];
Highcharts.chart('container', {
title: {
text: 'Highcharts Histogram'
},
xAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
yAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
series: [{
name: 'Histogram',
type: 'histogram',
xAxis: 1,
yAxis: 1,
baseSeries: 's1',
zIndex: -1
}, {
name: 'Data',
type: 'scatter',
data: data,
id: 's1',
marker: {
radius: 1.5
}
}]
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/histogram-bellcurve.js"></script>
<div id="container" height="400px" width="800px"></div>
It works in JSFiddle https://jsfiddle.net/dgdcnmwx/
First, the HTML you posted is invalid HTML. Your second script is missing a closing ". The div's id has invisible white space characters. There is no html element, etc.
Your HTML should look like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title</title>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/histogram-bellcurve.js"></script>
</head>
<body>
<div id="container" height="400px " width="800px "></div>
</body>
<script>
var data = [3.5, 3, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1, 3.7, 3.4, 3, 3,
4, 4.4, 3.9, 3.5, 3.8, 3.8, 3.4, 3.7, 3.6, 3.3, 3.4, 3, 3.4, 3.5, 3.4, 3.2,
3.1, 3.4, 4.1, 4.2, 3.1, 3.2, 3.5, 3.6, 3, 3.4, 3.5, 2.3, 3.2, 3.5, 3.8, 3,
3.8, 3.2, 3.7, 3.3, 3.2, 3.2, 3.1, 2.3, 2.8, 2.8, 3.3, 2.4, 2.9, 2.7, 2, 3,
2.2, 2.9, 2.9, 3.1, 3, 2.7, 2.2, 2.5, 3.2, 2.8, 2.5, 2.8, 2.9, 3, 2.8, 3,
2.9, 2.6, 2.4, 2.4, 2.7, 2.7, 3, 3.4, 3.1, 2.3, 3, 2.5, 2.6, 3, 2.6, 2.3,
2.7, 3, 2.9, 2.9, 2.5, 2.8, 3.3, 2.7, 3, 2.9, 3, 3, 2.5, 2.9, 2.5, 3.6, 3.2,
2.7, 3, 2.5, 2.8, 3.2, 3, 3.8, 2.6, 2.2, 3.2, 2.8, 2.8, 2.7, 3.3, 3.2, 2.8,
3, 2.8, 3, 2.8, 3.8, 2.8, 2.8, 2.6, 3, 3.4, 3.1, 3, 3.1, 3.1, 3.1, 2.7, 3.2,
3.3, 3, 2.5, 3, 3.4, 3];
Highcharts.chart('container', {
title: {
text: 'Highcharts Histogram'
},
xAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
yAxis: [{
title: { text: 'Data' }
}, {
title: { text: 'Histogram' },
opposite: true
}],
series: [{
name: 'Histogram',
type: 'histogram',
xAxis: 1,
yAxis: 1,
baseSeries: 's1',
zIndex: -1
}, {
name: 'Data',
type: 'scatter',
data: data,
id: 's1',
marker: {
radius: 1.5
}
}]
});
</script>
</html>
i want to replace decimal number in my array list with empty string "". How i can do that with lodash?
Here my array example:
[ 0, 0.05, 0.1, 0.15, 0.2, 0.25, 0.3, 0.35, 0.4, 0.45, 0.5, 0.55, 0.6, 0.65, 0.7, 0.75, 0.8, 0.85, 0.9, 0.95, 1, 1.05, 1.1, 1.15, 1.2, 1.25, 1.3, 1.35, 1.4, 1.45, 1.5, 1.55, 1.6, 1.65, 1.7, 1.75, 1.8, 1.85, 1.9, 1.95, 2, 2.05, 2.1, 2.15, 2.2, 2.25, 2.3, 2.35, 2.4, 2.45, 2.5, 2.55, 2.6, 2.65, 2.7, 2.75, 2.8, 2.85, 2.9, 2.95, 3, 3.05, 3.1, 3.15, 3.2, 3.25, 3.3, 3.35, 3.4, 3.45, 3.5, 3.55, 3.6, 3.65, 3.7, 3.75, 3.8, 3.85, 3.9, 3.95, 4, 4.05, 4.1, 4.15, 4.2, 4.25, 4.3, 4.35, 4.4, 4.45, 4.5, 4.55, 4.6, 4.65, 4.7, 4.75, 4.8, 4.85, 4.9, 4.95, 5, 5.05, 5.1, 5.15, 5.2, 5.25, 5.3, 5.35, 5.4, 5.45, 5.5, 5.55, 5.6, 5.65, 5.7, 5.75, 5.8, 5.85, 5.9, 5.95, 6, 6.05, 6.1, 6.15, 6.2, 6.25, 6.3, 6.35, 6.4, 6.45, 6.5, 6.55, 6.6, 6.65, 6.7, 6.75, 6.8, 6.85, 6.9, 6.95, 7, 7.05, 7.1, 7.15, 7.2, 7.25, 7.3, 7.35]
result i want:
["0", "", "", ..., "", "", "1", "", "", ..., "", "", "2", etc... ]
Just check if there is a dot after you convert to string
var data = [0, 0.05, 0.1, 0.15, 0.2, 0.25, 0.3, 0.35, 0.4, 0.45, 0.5, 0.55, 0.6, 0.65, 0.7, 0.75, 0.8, 0.85, 0.9, 0.95, 1, 1.05, 1.1, 1.15, 1.2, 1.25, 1.3, 1.35, 1.4, 1.45, 1.5, 1.55, 1.6, 1.65, 1.7, 1.75, 1.8, 1.85, 1.9, 1.95, 2, 2.05, 2.1, 2.15, 2.2, 2.25, 2.3, 2.35, 2.4, 2.45, 2.5, 2.55, 2.6, 2.65, 2.7, 2.75, 2.8, 2.85, 2.9, 2.95, 3, 3.05, 3.1, 3.15, 3.2, 3.25, 3.3, 3.35, 3.4, 3.45, 3.5, 3.55, 3.6, 3.65, 3.7, 3.75, 3.8, 3.85, 3.9, 3.95, 4, 4.05, 4.1, 4.15, 4.2, 4.25, 4.3, 4.35, 4.4, 4.45, 4.5, 4.55, 4.6, 4.65, 4.7, 4.75, 4.8, 4.85, 4.9, 4.95, 5, 5.05, 5.1, 5.15, 5.2, 5.25, 5.3, 5.35, 5.4, 5.45, 5.5, 5.55, 5.6, 5.65, 5.7, 5.75, 5.8, 5.85, 5.9, 5.95, 6, 6.05, 6.1, 6.15, 6.2, 6.25, 6.3, 6.35, 6.4, 6.45, 6.5, 6.55, 6.6, 6.65, 6.7, 6.75, 6.8, 6.85, 6.9, 6.95, 7, 7.05, 7.1, 7.15, 7.2, 7.25, 7.3, 7.35]
.map((e) => {
let str = '' + e;
return str.includes('.') ? '' : str
});
console.log(data)
Just wanted to add on answer from #charlietfl. This is another variation. I believe it has slightly higher performance, since there's no string creation operation on each tick.
var data = [0, 0.05, 0.1, 0.15, 0.2, 0.25, 0.3, 0.35, 0.4, 0.45, 0.5, 0.55, 0.6, 0.65, 0.7, 0.75, 0.8, 0.85, 0.9, 0.95, 1, 1.05, 1.1, 1.15, 1.2, 1.25, 1.3, 1.35, 1.4, 1.45, 1.5, 1.55, 1.6, 1.65, 1.7, 1.75, 1.8, 1.85, 1.9, 1.95, 2, 2.05, 2.1, 2.15, 2.2, 2.25, 2.3, 2.35, 2.4, 2.45, 2.5, 2.55, 2.6, 2.65, 2.7, 2.75, 2.8, 2.85, 2.9, 2.95, 3, 3.05, 3.1, 3.15, 3.2, 3.25, 3.3, 3.35, 3.4, 3.45, 3.5, 3.55, 3.6, 3.65, 3.7, 3.75, 3.8, 3.85, 3.9, 3.95, 4, 4.05, 4.1, 4.15, 4.2, 4.25, 4.3, 4.35, 4.4, 4.45, 4.5, 4.55, 4.6, 4.65, 4.7, 4.75, 4.8, 4.85, 4.9, 4.95, 5, 5.05, 5.1, 5.15, 5.2, 5.25, 5.3, 5.35, 5.4, 5.45, 5.5, 5.55, 5.6, 5.65, 5.7, 5.75, 5.8, 5.85, 5.9, 5.95, 6, 6.05, 6.1, 6.15, 6.2, 6.25, 6.3, 6.35, 6.4, 6.45, 6.5, 6.55, 6.6, 6.65, 6.7, 6.75, 6.8, 6.85, 6.9, 6.95, 7, 7.05, 7.1, 7.15, 7.2, 7.25, 7.3, 7.35]
.map((e) => {
return e % 1 === 0 ? e : '';
});
console.log(data)
Below is an example for creating a contour plot with plotly.js. Some of the contour lines overlap.
How can I alter the plotly settings to avoid that (e.g. increase resolution, switch contouring algorithm)? If I plot the same data using conrec.js the contours do not overlap.
A. Conrec.js (this works, no overlap)
Source code for the example:
https://github.com/jasondavies/conrec.js/tree/master/example
B. Plotly.js (does not work: overlapping contours)
Source code for the example:
https://jsfiddle.net/jwmdw3o1/
Resources:
https://cdn.plot.ly/plotly-latest.min.js
https://github.com/mbostock/d3/raw/v1.10.1/d3.js
Html:
<div id="graph"></div>
JavaScript:
var zData = createData();
var xData = d3.range(0, zData.length);
var yData = d3.range(0, zData[0].length);
var data = [ {
z: zData,
x: xData,
y: yData,
type: 'contour',
colorscale: 'Jet',
showscale: false,
autocontour: false,
contours: {
start: -5,
end: 3,
size: 0.5
}
}];
var layout = {
margin: {
b: 0,
l: 0,
r: 0,
t: 0
},
height: 600,
width: 600,
title: '',
xaxis: {
ticks: '',
showticklabels: false
},
yaxis: {
ticks: '',
showticklabels: false
}
};
Plotly.newPlot('graph', data, layout, {displayModeBar: false});
function createData(){
var data = [
[
0.4,
0.4,
0.7,
-1.0,
-0.1,
0.6,
-0.4,
0.6,
-0.4,
1.3,
0.7,
-0.4,
1.1,
1.3,
0.6,
0.1,
-0.0,
-0.8,
-0.8,
-1.0
],
[
0.4,
-0.4,
0.4,
-1.2,
-0.7,
0.4,
-0.9,
0.5,
-0.9,
1.2,
0.5,
-1.0,
1.3,
1.1,
0.5,
-0.0,
-0.1,
-1.2,
-1.0,
-0.9
],
[
0.7,
0.4,
0.1,
-1.2,
-0.2,
0.5,
-0.6,
0.6,
-0.2,
0.9,
0.6,
-0.5,
1.1,
0.8,
0.6,
0.1,
-0.4,
-0.9,
-0.7,
-0.8
],
[
-1.0,
-1.2,
-1.2,
-4.4,
-1.9,
-0.8,
-2.2,
-1.0,
-2.2,
0.0,
-0.3,
-2.0,
-0.2,
0.2,
-0.8,
-1.6,
-1.9,
-2.4,
-2.3,
-2.6
],
[
-0.1,
-0.7,
-0.2,
-1.9,
-2.0,
-0.5,
-1.9,
-0.3,
-1.7,
0.4,
-0.2,
-1.9,
0.3,
0.4,
-0.3,
-0.8,
-0.9,
-2.1,
-1.8,
-2.0
],
[
0.6,
0.4,
0.5,
-0.8,
-0.5,
-0.1,
-0.8,
0.6,
-0.5,
1.0,
0.5,
-0.7,
0.8,
1.0,
0.5,
0.1,
-0.3,
-0.9,
-0.7,
-1.1
],
[
-0.4,
-0.9,
-0.6,
-2.2,
-1.9,
-0.8,
-2.7,
-0.6,
-2.0,
0.3,
-0.3,
-2.3,
-0.0,
-0.0,
-0.6,
-1.1,
-1.3,
-2.4,
-2.0,
-2.2
],
[
0.6,
0.5,
0.6,
-1.0,
-0.3,
0.6,
-0.6,
0.1,
-0.8,
1.3,
0.8,
-0.8,
1.1,
1.3,
0.4,
0.1,
0.1,
-0.8,
-1.0,
-1.0
],
[
-0.4,
-0.9,
-0.2,
-2.2,
-1.7,
-0.5,
-2.0,
-0.8,
-2.9,
0.3,
-0.4,
-2.2,
-0.0,
-0.0,
-0.7,
-0.7,
-1.3,
-2.4,
-2.1,
-2.6
],
[
1.3,
1.2,
0.9,
0.0,
0.4,
1.0,
0.3,
1.3,
0.3,
1.1,
1.0,
0.2,
0.7,
1.9,
0.9,
-0.2,
0.3,
0.1,
-0.4,
-0.2
],
[
0.7,
0.5,
0.6,
-0.3,
-0.2,
0.5,
-0.3,
0.8,
-0.4,
1.0,
0.3,
-0.3,
1.0,
1.1,
0.6,
0.1,
0.3,
-0.7,
-0.5,
-0.6
],
[
-0.4,
-1.0,
-0.5,
-2.0,
-1.9,
-0.7,
-2.3,
-0.8,
-2.2,
0.2,
-0.3,
-2.7,
0.0,
-0.0,
-0.6,
-1.0,
-1.1,
-2.3,
-2.1,
-2.4
],
[
1.1,
1.3,
1.1,
-0.2,
0.3,
0.8,
-0.0,
1.1,
-0.0,
0.7,
1.0,
0.0,
1.6,
0.8,
1.0,
0.8,
0.7,
-0.2,
-0.2,
-0.2
],
[
1.3,
1.1,
0.8,
0.2,
0.4,
1.0,
-0.0,
1.3,
-0.0,
1.9,
1.1,
-0.0,
0.8,
1.2,
1.1,
0.0,
0.2,
-0.1,
-0.4,
0.0
],
[
0.6,
0.5,
0.6,
-0.8,
-0.3,
0.5,
-0.6,
0.4,
-0.7,
0.9,
0.6,
-0.6,
1.0,
1.1,
-0.2,
0.1,
-0.0,
-0.9,
-0.6,
-1.2
],
[
0.1,
-0.0,
0.1,
-1.6,
-0.8,
0.1,
-1.1,
0.1,
-0.7,
-0.2,
0.1,
-1.0,
0.8,
0.0,
0.1,
-0.6,
-0.4,
-1.2,
-1.3,
-1.4
],
[
-0.0,
-0.1,
-0.4,
-1.9,
-0.9,
-0.3,
-1.3,
0.1,
-1.3,
0.3,
0.3,
-1.1,
0.7,
0.2,
-0.0,
-0.4,
-1.3,
-1.4,
-1.6,
-1.9
],
[
-0.8,
-1.2,
-0.9,
-2.4,
-2.1,
-0.9,
-2.4,
-0.8,
-2.4,
0.1,
-0.7,
-2.3,
-0.2,
-0.1,
-0.9,
-1.2,
-1.4,
-3.0,
-2.3,
-2.5
],
[
-0.8,
-1.0,
-0.7,
-2.3,
-1.8,
-0.7,
-2.0,
-1.0,
-2.1,
-0.4,
-0.5,
-2.1,
-0.2,
-0.4,
-0.6,
-1.3,
-1.6,
-2.3,
-2.3,
-2.4
],
[
-1.0,
-0.9,
-0.8,
-2.6,
-2.0,
-1.1,
-2.2,
-1.0,
-2.6,
-0.2,
-0.6,
-2.4,
-0.2,
0.0,
-1.2,
-1.4,
-1.9,
-2.5,
-2.4,
-3.3
]
];
return data;
}
Adapting the line options with "smoothing: 0" resolves this:
var data = [ {
...
line: {
smoothing: 0
}
...
}];
https://plot.ly/javascript/reference/#contour-line