Creates a markup on a Sheet of a Floorplan.
Markups are user generated overlay elements that is displayed on top of a sheet of a Floorplan. Markups can be private to you
, set it by passing is_private: true
.
The data
field of a Markup follows the GeoJson format.
Schema looks like:
{
"type": "Feature",
"properties": {
"style": "See below: property.style",
"color": "#FF0000",
"opacity": 1,
"width": 16
},
"geometry": {
"type": "See below: geometry.type",
"coordinates": [
[
136,
95
],
[
277,
17
]
]
}
}
Properties.style can be one of these: "arrow", "cloud", "drawing", "ellipse", "highlighter", "measurement", "measurement_line", "polygon", "rectangle" ,"text"
Geometry.type is one of these: "Polygon","LineString"
Here is an example of an Arrow
:
{
"type": "Feature",
"properties": {
"style": "arrow",
"color": "#FF0000",
"opacity": 1,
"width": 16
},
"geometry": {
"type": "LineString",
"coordinates": [
[
136,
95
],
[
277,
17
]
]
}
}
Here is an example of a Drawing
:
{
"type": "Feature",
"properties": {
"style": "drawing",
"color": "#0000FF",
"opacity": 1,
"width": 16
},
"geometry": {
"type": "LineString",
"coordinates": [
[
639,
406
],
[
639,
392
]
]
}
}
Here is an example of a Ellipse
:
{
"properties": {
"style": "ellipse",
"color": "#FF7F00",
"opacity": 1,
"width": 2
},
"geometry": {
"coordinates": [
[
1775,
298
]
],
"radii": [
136.03858998144713,
56.115918367346936
]
}
}
Here is an example of a Measurement
:
{
"type": "Feature",
"properties": {
"style": "measurement",
"color": "#FF7F00",
"opacity": 1,
"width": 16,
"description": "1 centimeter",
"fontSize": 48
},
"geometry": {
"type": "LineString",
"coordinates": [
[
217,
620
],
[
359,
622
]
]
}
}
Here is an example of a Text
:
{
"type": "Feature",
"properties": {
"style": "text",
"color": "#FF0000",
"description": "Sample",
"fontSize": 48
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
760,
144
],
[
936,
144
],
[
936,
239
],
[
760,
239
]
]
}
}
Here is an example of a Polygon
:
{
"type": "Feature",
"properties": {
"style": "polygon",
"color": "#FF0000",
"opacity": 1,
"width": 2
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
286,
612
],
[
408,
609
],
[
408,
697
],
[
337,
554
]
]
}
}
Here is an example of a Measurement Line
, used to calibrate for scale:
{
"type": "Feature",
"properties": {
"style": "measurementline",
"color": "#FF0000",
"width": 2,
"fontSize": 16
},
"geometry": {
"type": "LineString",
"coordinates": [
[
660,
976
],
[
830,
973
]
]
}
}
Here is a Rectangle
:
{
"type": "Feature",
"properties": {
"style": "rectangle",
"color": "#FF00FF",
"opacity": 1,
"width": 2
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
136,
816
],
[
275,
816
],
[
275,
898
],
[
136,
898
]
]
}
}
Here is a Highlighter
:
{
"type": "Feature",
"properties": {
"style": "highlighter",
"color": "#FF00FF",
"opacity": 0.25,
"width": 40
},
"geometry": {
"type": "LineString",
"coordinates": [
[
881,
415
],
[
881,
418
]
]
}
}
Here is an example of a Cloud
shape that is private, the entire POST
body:
{
"id": "4d109283-acc3-4a20-9e9c-21c71fdd8b51",
"creator_user_id": 39048,
"last_editor_user_id": 39048,
"project_id": "c8fe9ca2-1a8a-4c03-a317-90d9a3d516fa",
"resolved_conflict": false,
"created_at": "2020-12-24T03:19:58.234Z",
"updated_at": "2020-12-24T03:19:58.234Z",
"device_created_at": "2020-12-24T03:19:57.488Z",
"device_updated_at": "2020-12-24T03:19:57.488Z",
"deleted_at": null,
"sheet_id": "7e21cfaa-5a6b-4796-b369-036c906805e4",
"is_private": true,
"data": {
"type": "Feature",
"properties": {
"style": "cloud",
"color": "#7700B9",
"opacity": 1,
"arcRadius": 8
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
405,
1068
],
[
709,
1068
],
[
709,
1260
],
[
405,
1260
]
]
}
}
}
One way to see how Fieldwire is constructing these Markup data
is to examine the XHR tab of a browser developer console
and when you use the Floorplan markup tools, see what the body it is being POSTed to Fieldwire.