- See also
Method Overview
Name | Return Type | Summary | Object |
---|---|---|---|
Promise<GenerateSymbolResponse> | Converts a Scalable Vector Graphic (SVG) to a CIMSymbol. more details | symbolService |
Method Details
-
generateSymbol(url, params, requestOptions){Promise<GenerateSymbolResponse>}
-
Converts a Scalable Vector Graphic (SVG) to a CIMSymbol.
If using a SVG string value in the GenerateSymbolParameters, the XML namespace (
xmlns
) must be defined. For SVGs defined inFormData
or anHTMLFormElement
, thename
of the element in the form must be"svgImage"
, as shown in the examples below.The returned CIMSymbol will always be a CIMPointSymbol with a CIMVectorMarker symbol layer where
size = 10
. To update the size of the symbol, use cimSymbolUtils.scaleCIMSymbolTo().Parametersurl StringURL to the ArcGIS Server REST resource that represents a symbol service.
params GenerateSymbolParametersInput parameters for converting an SVG to CIM Symbol.
requestOptions RequestOptionsoptionalAdditional options to be used for the data request (will override requestOptions defined during construction).
ReturnsType Description Promise<GenerateSymbolResponse> A promise that resolves with the response of the generate symbol method that contains the CIM Symbol. Examples// Using a string. const svgString = ` <svg xmlns="http://www.w3.org/2000/svg" height="200" width="200"> <path d="M150 0 L75 200 L225 200 Z" /> </svg> `; const params = { svgImage: svgString }; symbolService.generateSymbol(symbolServiceUrl, params).then({symbol} => { // apply the CIMSymbol to a graphic graphicA.symbol = symbol; });
// Using FormData. const blob = new Blob([svgSymbol.trim()], { type: "image/svg+xml" }); const formData = new FormData(); formData.append("svgImage", blob, "symbol.svg"); const params = { svgImage: formData }; symbolService.generateSymbol(symbolServiceUrl, params).then({symbol} => { // apply the CIMSymbol to a graphic graphicB.symbol = symbol; });
// Using HTMLFormElement. <!-- HTML Element --> <form name="uploadForm"> <input type="file" name="svgImage" id="svgFile" /> </form> // JavaScript const uploadForm = document.forms["uploadForm"]; uploadForm.addEventListener("change", (event) => { const fileName = event.target.value.toLowerCase(); if (fileName.includes(".svg")) { const params = { svgImage: uploadForm }; symbolService.generateSymbol(symbolServiceUrl, params).then({symbol} => { // apply the CIMSymbol to a graphic graphicC.symbol = symbol; }); } });
Type Definitions
-
GenerateSymbolParameters Object
-
Input parameters for the generateSymbol method.
- Property
-
svgImage String|FormData|HTMLFormElement
The SVG image to convert. Can be an SVG string value, form data, or form element. When providing the SVG from
FormData
orHTMLFormElement
, thename
of the element in the form must be"svgImage"
. When providing the SVG from a string, the XML namespace (xmlns
) must be defined.
-
GenerateSymbolResponse Object
-
The response of the generateSymbol method.
- Property
-
symbol CIMSymbol
The CIMSymbol created from the generateSymbol method.