Line

• Lumin
• iOS
• Android

​

Description

The Line component renders a colored line. The Line component creates lines as a series of line segments. Line follows the order in which the points are added, and must have at least two points. Line color is a multiplier to the vertex color. Create disconnected lines by adding line breaks to the Line.

Example

import React from "react";

import { View, Line, Scene, Prism } from "magic-script-components";

export default class MyApp extends React.Component {

render() {

const points = [

[-0.35, -0.35, -0.2],

[0.35, 0.35, 0.2],

[-0.35, -0.35, 0.2],

[-0.35, 0.35, -0.2],

[0.35, -0.35, 0.2],

[-0.35, -0.35, -0.2]

];

return (

<Scene>

<Prism size={[1, 1, 0.5]} >

<View name="main-view" alignment={'center-center'}>

<Line points={points} color={[0.5, 1.0, 0.25, 0.8]} />

</View>

</Prism>

</Scene>

);

}

}

Common Events

Common Properties

Element Properties

Name	Type	Default Value	Description
points	[vec3]	n/a	Sets the points that describe this series of line segments. The line follows the order in which the points are added. No line can exist if there is less than two points.