SvgCreate

From Multi Theft Auto: Wiki
Revision as of 17:37, 26 September 2021 by LopSided (talk | contribs) (Initial page creation)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Creates an SVG from size (blank document), filepath or raw data.

Syntax

svg svgCreate ( int width, int height [, string pathOrRawdata, function callback ( bool didLoad ) ] )

Returns

  • Returns an svg element if the SVG was created successfully, false otherwise.

Example

The example below shows how you can load an SVG from raw data (or path) and manipulate the underlying XML document.

IMPORTANT: Depending on your implementation, callback usage may be necessary to ensure the SVG texture and XML document are ready.

-- This could also be a file, with the path provided to svgCreate
local rawSvgData = [[
    <svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg">
        <circle cx="250" cy="250" r="250" fill="#0fc0fc" />
    </svg>
]]

local svg

function init()
    -- Create an SVG containing a circle, using the raw XML data above
    svg = svgCreate(500, 500, rawSvgData, function(didLoad)
        if (not didLoad) then -- SVG failed to load, so don't continue
            return 
        end

        onSvgLoad(svg)
    end)
end
addEventHandler("onClientResourceStart", resourceRoot, init)


-- Implement a callback for SVG load, to manipulate the underlying XML document
function onSvgLoad(svg)
    -- Get the XML document from our SVG
    local svgXML = svgGetDocumentXML(svg)
    
    -- Add a rect SVG node, positioned center of the document
    local rect = xmlCreateChild(svgXML, "rect")
    xmlNodeSetAttribute(rect, "x", "25%")
    xmlNodeSetAttribute(rect, "y", "25%")
    xmlNodeSetAttribute(rect, "width", "50%")
    xmlNodeSetAttribute(rect, "height", "50%")
    xmlNodeSetAttribute(rect, "fill", "#00749b")
    
    -- Apply our XML to the SVG, and start drawing via callback
    return svgSetDocumentXML(svg, svgXML, function()
        addEventHandler("onClientRender", root, render)
    end)
end

function render()
    local width, height = svgGetSize(svg)
    dxDrawImage(0, 0, width, height, svg, 0, 0, 0, tocolor(255, 255, 255), false)
end

-- Add a keybind which sets the SVG to a random size
bindKey("r", "down", function()
    if (not isElement(svg)) or (getElementType(svg) ~= "svg") then
        return false
    end

    local size = math.random(100, 500)
    svgSetSize(svg, size, size)
end)

Requirements

This template will be deleted.

See Also