racherdan
Posts: 2
Joined: Tue May 09, 2023 9:47 am

Highcharts 3D Line - Invalid connection lines

Hello.

I am currently trying to display lines in a 3D graph.

I know that this is not officially supported yet, but I have found many examples where it works.

In my local development environment I get some connection lines drawn that don't exist in the data.

When I play with Fiddle everything works as planned: https://jsfiddle.net/qudmwv5r/

Version used: 10.2.1 with Highcharts-Angular 3.0.0.

Does anyone know this problem or what I can do? Unfortunately I have no idea why it works in Fiddle and not in my system.

Chart Configuration i use:

Code: Select all

{
 "chart": {
  "renderTo": "container",
  "margin": 100,
  "type": "scatter3d",
  "options3d": {
   "enabled": true,
   "alpha": 0,
   "beta": 0,
   "depth": 250,
   "fitToPlot": false,
   "viewDistance": 5
  }
 },
 "yAxis": {
  "title": {
   "text": "Y"
  }
 },
 "xAxis": {
  "title": {
   "text": "X"
  }
 },
 "zAxis": {
  "title": {
   "text": "Z"
  }
 },
 "legend": {
  "enabled": false
 },
 "series": [
  {
   "lineWidth": 2,
   "type": "scatter3d",
   "name": "ActualPath",
   "color": "green",
   "colorByPoint": false,
   "data": [
    [
     141.5,
     70.34,
     -459.32
    ],
    [
     141.5,
     70.34,
     -459.312
    ],
    [
     141.5,
     70.34,
     -459.2559
    ],
    [
     141.5,
     70.34,
     -459.1031
    ],
    [
     141.5,
     70.34,
     -458.8151
    ],
    [
     141.5,
     70.34,
     -458.3844
    ],
    [
     141.5,
     70.34,
     -457.8101
    ],
    [
     141.5,
     70.34,
     -457.0909
    ],
    [
     141.5,
     70.34,
     -456.226
    ],
    [
     141.5,
     70.34,
     -455.2144
    ],
    [
     141.5,
     70.34,
     -454.0557
    ],
    [
     141.5,
     70.34,
     -452.7495
    ],
    [
     141.5,
     70.34,
     -451.3174
    ],
    [
     141.5,
     70.34,
     -449.8085
    ],
    [
     141.5,
     70.34,
     -448.2747
    ],
    [
     141.5,
     70.34,
     -446.7681
    ],
    [
     141.5,
     70.34,
     -445.3405
    ],
    [
     141.5,
     70.34,
     -444.041
    ],
    [
     141.5,
     70.34,
     -442.8885
    ],
    [
     141.5,
     70.34,
     -441.883
    ],
    [
     141.5,
     70.34,
     -441.024
    ],
    [
     141.5,
     70.34,
     -440.3109
    ],
    [
     141.5,
     70.34,
     -439.7431
    ],
    [
     141.5,
     70.34,
     -439.32
    ],
    [
     141.5,
     70.3436,
     -439.0392
    ],
    [
     141.5,
     70.369,
     -438.8901
    ],
    [
     141.5,
     70.4379,
     -438.8606
    ],
    [
     141.5,
     70.5721,
     -438.939
    ],
    [
     141.5,
     70.7928,
     -439.1136
    ],
    [
     141.5,
     71.1117,
     -439.3737
    ],
    [
     141.5,
     71.5292,
     -439.7086
    ],
    [
     141.5,
     72.0452,
     -440.1082
    ],
    [
     141.5,
     72.6596,
     -440.5625
    ],
    [
     141.5,
     73.3722,
     -441.0625
    ],
    [
     141.5,
     74.1828,
     -441.5991
    ],
    [
     141.5,
     75.0914,
     -442.1638
    ],
    [
     141.5,
     76.0977,
     -442.7487
    ],
    [
     141.5,
     77.2016,
     -443.3462
    ],
    [
     141.5,
     78.403,
     -443.949
    ],
    [
     141.5,
     79.7016,
     -444.5504
    ],
    [
     141.5,
     81.0974,
     -445.144
    ],
    [
     141.5,
     82.5902,
     -445.7238
    ],
    [
     141.5,
     84.1799,
     -446.2846
    ],
    [
     141.5,
     85.8663,
     -446.821
    ],
    [
     141.5,
     87.6493,
     -447.3286
    ],
    [
     141.5,
     89.5288,
     -447.8028
    ],
    [
     141.5,
     91.5044,
     -448.2401
    ],
    [
     141.5,
     93.5683,
     -448.6367
    ],
    [
     141.5,
     95.6998,
     -448.9899
    ],
    [
     141.5,
     97.8779,
     -449.2968
    ],
    [
     141.5,
     100.0815,
     -449.5551
    ],
    [
     141.5,
     102.2912,
     -449.7631
    ],
    [
     141.5,
     104.5002,
     -449.9193
    ],
    [
     141.5,
     106.7086,
     -450.0225
    ],
    [
     141.5,
     108.9165,
     -450.072
    ],
    [
     141.5,
     111.1239,
     -450.0676
    ],
    [
     141.5,
     113.3309,
     -450.0093
    ],
    [
     141.5,
     115.5375,
     -449.8976
    ],
    [
     141.5,
     117.744,
     -449.7332
    ],
    [
     141.5,
     119.9499,
     -449.5173
    ],
    [
     141.5,
     122.1465,
     -449.2517
    ],
    [
     141.5,
     124.3136,
     -448.9382
    ],
    [
     141.5,
     126.4302,
     -448.5792
    ],
    [
     141.5,
     128.4755,
     -448.1775
    ],
    [
     141.5,
     130.4303,
     -447.7361
    ],
    [
     141.5,
     132.2887,
     -447.2587
    ],
    [
     141.5,
     134.0508,
     -446.7491
    ],
    [
     141.5,
     135.7165,
     -446.2115
    ],
    [
     141.5,
     137.2859,
     -445.6507
    ],
    [
     141.5,
     138.7589,
     -445.0718
    ],
    [
     141.5,
     140.1354,
     -444.4803
    ],
    [
     141.5,
     141.4155,
     -443.8819
    ],
    [
     141.5,
     142.5991,
     -443.283
    ],
    [
     141.5,
     143.6861,
     -442.6903
    ],
    [
     141.5,
     144.6765,
     -442.1108
    ],
    [
     141.5,
     145.5703,
     -441.552
    ],
    [
     141.5,
     146.3672,
     -441.0219
    ],
    [
     141.5,
     147.0674,
     -440.5286
    ],
    [
     141.5,
     147.6706,
     -440.081
    ],
    [
     141.5,
     148.1768,
     -439.688
    ],
    [
     141.5,
     148.586,
     -439.3594
    ],
    [
     141.5,
     148.898,
     -439.1049
    ],
    [
     141.5,
     149.1135,
     -438.9348
    ],
    [
     141.5,
     149.2444,
     -438.86
    ],
    [
     141.5,
     149.3117,
     -438.8915
    ],
    [
     141.5,
     149.3365,
     -439.0409
    ],
    [
     141.5,
     149.34,
     -439.32
    ],
    [
     141.5,
     149.34,
     -439.7389
    ],
    [
     141.5,
     149.34,
     -440.2992
    ],
    [
     141.5,
     149.34,
     -440.9999
    ],
    [
     141.5,
     149.34,
     -441.8399
    ],
    [
     141.5,
     149.34,
     -442.818
    ],
    [
     141.5,
     149.34,
     -443.933
    ],
    [
     141.5,
     149.34,
     -445.1828
    ],
    [
     141.5,
     149.34,
     -446.5455
    ],
    [
     141.5,
     149.34,
     -447.9748
    ],
    [
     141.5,
     149.34,
     -449.4243
    ],
    [
     141.5,
     149.34,
     -450.8484
    ],
    [
     141.5,
     149.34,
     -452.2016
    ],
    [
     141.5,
     149.34,
     -453.4437
    ],
    [
     141.5,
     149.34,
     -454.5633
    ],
    [
     141.5,
     149.34,
     -455.561
    ],
    [
     141.5,
     149.34,
     -456.4371
    ],
    [
     141.5,
     149.34,
     -457.1917
    ],
    [
     141.5,
     149.34,
     -457.8246
    ],
    [
     141.5,
     149.34,
     -458.3355
    ],
    [
     141.5,
     149.34,
     -458.724
    ],
    [
     141.5,
     149.34,
     -458.9934
    ],
    [
     141.5,
     149.34,
     -459.1766
    ],
    [
     141.5,
     149.34,
     -459.32
    ]
   ],
   "dataLabels": {
    "enabled": true,
    "format": "{point.name}",
    "color": "#ffffff",
    "style": {
     "textOutline": false,
     "fontSize": "12px"
    }
   },
   "marker": {
    "symbol": "circle",
    "radius": 2,
    "lineWidth": 1
   }
  },
  {
   "lineWidth": 2,
   "type": "scatter3d",
   "name": "NewPath",
   "color": "red",
   "colorByPoint": false,
   "data": [
    [
     141.5,
     70.34,
     -459.32
    ],
    [
     141.5,
     70.34,
     -459.312
    ],
    [
     141.5,
     70.34,
     -459.2559
    ],
    [
     141.5,
     70.34,
     -459.1031
    ],
    [
     141.5,
     70.34,
     -458.8151
    ],
    [
     141.5,
     70.34,
     -458.3844
    ],
    [
     141.5,
     70.34,
     -457.8101
    ],
    [
     141.5,
     70.34,
     -457.0909
    ],
    [
     141.5,
     70.34,
     -456.226
    ],
    [
     141.5,
     70.34,
     -455.2144
    ],
    [
     141.5,
     70.34,
     -454.0557
    ],
    [
     141.5,
     70.34,
     -452.7495
    ],
    [
     141.5,
     70.34,
     -451.3174
    ],
    [
     141.5,
     70.34,
     -449.8085
    ],
    [
     141.5,
     70.34,
     -448.2747
    ],
    [
     141.5,
     70.34,
     -446.7681
    ],
    [
     141.5,
     70.34,
     -445.3405
    ],
    [
     141.5,
     70.34,
     -444.041
    ],
    [
     141.5,
     70.34,
     -442.8885
    ],
    [
     141.5,
     70.34,
     -441.883
    ],
    [
     141.5,
     70.34,
     -441.024
    ],
    [
     141.5,
     70.34,
     -440.3109
    ],
    [
     141.5,
     70.34,
     -439.7431
    ],
    [
     141.5,
     70.34,
     -439.32
    ],
    [
     141.5,
     70.3436,
     -439.0392
    ],
    [
     141.5,
     70.369,
     -438.8901
    ],
    [
     141.5001,
     70.4379,
     -438.8606
    ],
    [
     141.5002,
     70.5721,
     -438.939
    ],
    [
     141.5004,
     70.7928,
     -439.1136
    ],
    [
     141.5007,
     71.1117,
     -439.3737
    ],
    [
     141.5012,
     71.5292,
     -439.7086
    ],
    [
     141.5019,
     72.0452,
     -440.1082
    ],
    [
     141.5029,
     72.6596,
     -440.5625
    ],
    [
     141.5043,
     73.3722,
     -441.0625
    ],
    [
     141.5061,
     74.1828,
     -441.5991
    ],
    [
     141.5083,
     75.0914,
     -442.1638
    ],
    [
     141.5111,
     76.0977,
     -442.7487
    ],
    [
     141.5144,
     77.2016,
     -443.3462
    ],
    [
     141.5184,
     78.403,
     -443.949
    ],
    [
     141.5232,
     79.7016,
     -444.5504
    ],
    [
     141.5287,
     81.0974,
     -445.144
    ],
    [
     141.5352,
     82.5902,
     -445.7238
    ],
    [
     141.5425,
     84.1799,
     -446.2846
    ],
    [
     141.5508,
     85.8663,
     -446.821
    ],
    [
     141.5602,
     87.6493,
     -447.3286
    ],
    [
     141.5707,
     89.5288,
     -447.8028
    ],
    [
     141.5823,
     91.5044,
     -448.2401
    ],
    [
     141.5952,
     93.5683,
     -448.6367
    ],
    [
     141.6093,
     95.6998,
     -448.9899
    ],
    [
     141.6246,
     97.8779,
     -449.2968
    ],
    [
     141.6413,
     100.0815,
     -449.5551
    ],
    [
     141.6593,
     102.2912,
     -449.7631
    ],
    [
     141.6786,
     104.5002,
     -449.9193
    ],
    [
     141.6994,
     106.7086,
     -450.0225
    ],
    [
     141.7215,
     108.9165,
     -450.072
    ],
    [
     141.7449,
     111.1239,
     -450.0676
    ],
    [
     141.7696,
     113.3309,
     -450.0093
    ],
    [
     141.7957,
     115.5375,
     -449.8976
    ],
    [
     141.823,
     117.744,
     -449.7332
    ],
    [
     141.8516,
     119.9499,
     -449.5173
    ],
    [
     141.8813,
     122.1465,
     -449.2517
    ],
    [
     141.9121,
     124.3136,
     -448.9382
    ],
    [
     141.9439,
     126.4302,
     -448.5792
    ],
    [
     141.9766,
     128.4755,
     -448.1775
    ],
    [
     142.0101,
     130.4303,
     -447.7361
    ],
    [
     142.0442,
     132.2887,
     -447.2587
    ],
    [
     142.0789,
     134.0508,
     -446.7491
    ],
    [
     142.114,
     135.7165,
     -446.2115
    ],
    [
     142.1492,
     137.2859,
     -445.6507
    ],
    [
     142.1844,
     138.7589,
     -445.0718
    ],
    [
     142.2194,
     140.1354,
     -444.4803
    ],
    [
     142.254,
     141.4155,
     -443.8819
    ],
    [
     142.2878,
     142.5991,
     -443.283
    ],
    [
     142.3207,
     143.6861,
     -442.6903
    ],
    [
     142.3524,
     144.6765,
     -442.1108
    ],
    [
     142.3825,
     145.5703,
     -441.552
    ],
    [
     142.4107,
     146.3672,
     -441.0219
    ],
    [
     142.4367,
     147.0674,
     -440.5286
    ],
    [
     142.4601,
     147.6706,
     -440.081
    ],
    [
     142.4804,
     148.1768,
     -439.688
    ],
    [
     142.4974,
     148.586,
     -439.3594
    ],
    [
     142.5104,
     148.898,
     -439.1049
    ],
    [
     142.5191,
     149.1135,
     -438.9348
    ],
    [
     142.5229,
     149.2444,
     -438.86
    ],
    [
     142.5214,
     149.3117,
     -438.8915
    ],
    [
     142.5139,
     149.3365,
     -439.0409
    ],
    [
     142.5,
     149.34,
     -439.32
    ],
    [
     142.479,
     149.34,
     -439.7389
    ],
    [
     142.451,
     149.34,
     -440.2992
    ],
    [
     142.416,
     149.34,
     -440.9999
    ],
    [
     142.374,
     149.34,
     -441.8399
    ],
    [
     142.3251,
     149.34,
     -442.818
    ],
    [
     142.2693,
     149.34,
     -443.933
    ],
    [
     142.2069,
     149.34,
     -445.1828
    ],
    [
     142.1387,
     149.34,
     -446.5455
    ],
    [
     142.0673,
     149.34,
     -447.9748
    ],
    [
     141.9948,
     149.34,
     -449.4243
    ],
    [
     141.9236,
     149.34,
     -450.8484
    ],
    [
     141.8559,
     149.34,
     -452.2016
    ],
    [
     141.7938,
     149.34,
     -453.4437
    ],
    [
     141.7378,
     149.34,
     -454.5633
    ],
    [
     141.6879,
     149.34,
     -455.561
    ],
    [
     141.6441,
     149.34,
     -456.4371
    ],
    [
     141.6064,
     149.34,
     -457.1917
    ],
    [
     141.5748,
     149.34,
     -457.8246
    ],
    [
     141.5492,
     149.34,
     -458.3355
    ],
    [
     141.5298,
     149.34,
     -458.724
    ],
    [
     141.5163,
     149.34,
     -458.9934
    ],
    [
     141.5072,
     149.34,
     -459.1766
    ],
    [
     141.5,
     149.34,
     -459.32
    ]
   ],
   "dataLabels": {
    "enabled": true,
    "format": "{point.name}",
    "color": "#ffffff",
    "style": {
     "textOutline": false,
     "fontSize": "12px"
    }
   },
   "marker": {
    "symbol": "circle",
    "radius": 2,
    "lineWidth": 1
   }
  }
 ]
}
Attachments
HighCharts Lines.png
HighCharts Lines.png (112.11 KiB) Viewed 193 times
User avatar
dawid.d
Posts: 837
Joined: Thu Oct 06, 2022 11:31 am

Re: Highcharts 3D Line - Invalid connection lines

Hello,

Welcome to our forum and thanks for contacting us with your question!

I have reproduced your demo in angular using stackblitz and everything seems to be working fine. Can you take a look at the demo below and let me know if there's anything not working for you?

Demo: https://stackblitz.com/edit/highcharts- ... mponent.ts

I hope you will find it useful
Best regards
Dawid Draguła
Highcharts Developer
racherdan
Posts: 2
Joined: Tue May 09, 2023 9:47 am

Re: Highcharts 3D Line - Invalid connection lines

Sorry for the late reply.

The error was on my side: In order to display annotations in addition to the line (which consists of several hundred points), I passed a second series containing only the points "Pos1"/"GRST"/... . With this second series, I accidentally specified a line strength, thus these connecting lines were drawn for me.

Unfortunately, I apparently did not copy this in my sample configuration.

Sorry. Maybe my answer will help if someone has the problem after the same misconfiguration.

Code: Select all

{
	"lineWidth": 2,
	"type": "scatter3d",
	"name": "ActualPath",
	"color": "green",
	"colorByPoint": false,
	"marker": {
		"enabled": false
	},
	"data": [ all data points ]
},
{
	"lineWidth": 0, <<<<<<<<<< here was the mistake
	"type": "scatter3d",
	"name": "ActualPath",
	"color": "green",
	"colorByPoint": false,
	"data": [
		{
			"x": 161.5,
			"y": 139.34,
			"z": -454.32,
			"name": "GRST"
		},
		{
			"x": 161.5,
			"y": 139.34,
			"z": -439.32,
			"name": "NachGRST"
		},
		{
			"x": 141.43707,
			"y": 139.34,
			"z": -439.32,
			"name": "VorPos1"
		},
		{
			"x": 141.5,
			"y": 139.34,
			"z": -454.32,
			"name": "Pos1"
		}
	],
	"dataLabels": {
		"enabled": true,
		"format": "{point.name}",
		"color": "#ffffff",
		"style": {
			"textOutline": false,
			"fontSize": "12px"
		}
	},
	"marker": {
		"symbol": "circle",
		"radius": 2,
		"lineWidth": 1
	}
}

Return to “Highcharts Usage”