Giter Club home page Giter Club logo

Comments (8)

danpalmieri avatar danpalmieri commented on May 24, 2024 1

Poor (but fast 😶) workaround:
{!! Str::replaceFirst(' y="50"', ' y="54"', Avatar::create('Susilo Bambang Yudhoyono')->toSvg()) !!}

from avatar.

neoteknic avatar neoteknic commented on May 24, 2024
  • suggestion : is it possible to vectorize text instead of output it in SVG ?

from avatar.

uyab avatar uyab commented on May 24, 2024

Hi @neoteknic, sorry I little bit busy in recent weeks. Any help welcome for this issue :)

from avatar.

neoteknic avatar neoteknic commented on May 24, 2024

image
Maybe a font issue, look at this image on Google chrome windows 10 x64.

from avatar.

neoteknic avatar neoteknic commented on May 24, 2024

image

Chrome ; Firefox ; Edge
Browser issue ? but possible to fire in Avatar.php toSvg() maybe.

from avatar.

fannyfan414 avatar fannyfan414 commented on May 24, 2024

I extend Avatar class and in method toSvg add 4px to "y" coordinate.
This line

$svg .= '<text x="' . $center . '" y="' . ($center + 4);

With this modification content is now aligned correctly

<?php
/**
 * Created by PhpStorm.
 * User: Workstation
 * Date: 11.09.2019
 * Time: 23:21
 */

namespace App\Services\AvatarGenerator;


use Laravolt\Avatar\Avatar;

class AvatarGenerator extends Avatar
{
    public function toSvg()
    {
        $this->buildInitial();

        $x = $y = $this->borderSize / 2;
        $width = $height = $this->width - $this->borderSize;
        $radius = ($this->width - $this->borderSize) / 2;
        $center = $this->width / 2;

        $svg = '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" width="' . $this->width . '" height="' . $this->height . '">';

        if ($this->shape == 'square') {
            $svg .= '<rect x="' . $x
                . '" y="' . $y
                . '" width="' . $width . '" height="' . $height
                . '" stroke="' . $this->borderColor
                . '" stroke-width="' . $this->borderSize
                . '" fill="' . $this->background . '" />';
        } elseif ($this->shape == 'circle') {
            $svg .= '<circle cx="' . $center
                . '" cy="' . $center
                . '" r="' . $radius
                . '" stroke="' . $this->borderColor
                . '" stroke-width="' . $this->borderSize
                . '" fill="' . $this->background . '" />';
        }

        $svg .= '<text x="' . $center . '" y="' . ($center + 4);
        $svg .= '" font-size="' . $this->fontSize;

        if ($this->fontFamily) {
            $svg .= '" font-family="' . $this->fontFamily;
        }

        $svg .= '" fill="' . $this->foreground . '" alignment-baseline="middle" text-anchor="middle" dominant-baseline="central">';
        $svg .= $this->getInitial();
        $svg .= '</text>';

        $svg .= '</svg>';

        return $svg;
    }

}

from avatar.

uyab avatar uyab commented on May 24, 2024

Just found https://github.com/meyfa/php-svg, will try to refactor the svg part using it.

from avatar.

uyab avatar uyab commented on May 24, 2024

Fixed in 4.1.4

from avatar.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.