davidpiesse / nova-map

Laravel Nova Map Field
114 stars 29 forks source link

The Map field is not displaying anything #35

Closed desaintflorent closed 3 years ago

desaintflorent commented 3 years ago

Hi there,

I installed your package and laravel-mysql-spatial Then in my model , I added:

use Grimzy\LaravelMysqlSpatial\Eloquent\SpatialTrait;

and

protected $spatialFields = [ 'location', ];

And in Nova resource fields array :

Map::make('Location')->spatialType('Point'),

In migration of my model i have

$table->point('location', 4326);

And I tried with other ( Polygon etc ..) But the field is not displaying. there is no error in consol or php log. I event tried to downgrade to v0.0.6 but same result. Is there something I'm missing ? Don't hesitate if I can give you more precision on this bug.

Here my current config :

php 7.4.3 davidpiesse/nova-map v0.0.7 grimzy/laravel-mysql-spatial v4.0.0 laravel/nova v3.15.0 laravel/framework v8.14.0

davidpiesse commented 3 years ago

Is the element there in Dev tools? I would stick on v0.0.6 or earlier for now.

desaintflorent commented 3 years ago

In dev tool I can see this :

``

``

I already downgrade to 0.0.6 but same problem.

davidpiesse commented 3 years ago

Add a ->height('300px') to your Nova field. I had the same issue- and by adding a height explicitly it worked. I am thinking something in Tailwind has changed. I will release a new version 0.0.8 which is Nova 3.

desaintflorent commented 3 years ago

Tried it too but doesn't work either... It's not only the map that is missing but the entire field ( including the title of the field )

davidpiesse commented 3 years ago

OK, maybe the namespace for the class is not right..

use Davidpiesse\Map\Map;
  Map::make('Location')
                ->spatialType('LatLon')
                ->latitude('latitude')
                ->longitude('longitude')
                ->height('300px'),
desaintflorent commented 3 years ago

No, same problem

it looks like the vue component is not transformed into html properly because in devtool I see

<detail-map-field resource-name="stores" resource-id="1" resource="[object Object]" field="[object Object]" class="remove-bottom-border"></detail-map-field>

But shouldn't i see something like this ?

<div class="flex border-b border-40">
        <div class="w-1/4 py-4">
            <slot>
                <h4 class="font-normal text-80">
                    {{ field.name }}
                </h4>
            </slot>
        </div>
        <div class="w-3/4 py-4">
            <div class="rounded flex flex-col" :style="'height: ' + field.height">
                <map-detail
                    :type="field.spatialType"
                    :zoom="field.zoom"
                    :value="field.value"
                    :latitude_field="field.latitude_field"
                    :longitude_field="field.longitude_field"
                    :geojson_field="field.geojson_field"
                >
                </map-detail>
            </div>
        </div>
    </div>
davidpiesse commented 3 years ago

Hmmm... I have just pulled it back into a fresh app from Nova. (I tagged 0.0.8).

It is rendering correctly for me with a lael and field section. The map detail looks like/starts with this.

 <div data-v-70225ce7="" class="vue2leaflet-map w-full h-full rounded z-10 leaflet-container leaflet-touch leaflet-fade-anim leaflet-grab leaflet-touch-drag leaflet-touch-zoom" tabindex="0" style="position: relative;"></div>
desaintflorent commented 3 years ago

Tried it multiple times, without luck with this new version ( removing composer.lock + vendor folder and install again each time ) Then I tried it with a fresh Laravel installation and it was working has expected. Finally I tried it again on my app and now it's working as expected. I have no clue why it's working now... But thank's anyway for spending some time to help me with this !

davidpiesse commented 3 years ago

How odd!

I am glad it's working again. I want to spend a bunch of time on this making it amazing - but I am waiting for my day job to have the need for this :)

desaintflorent commented 3 years ago

Would love to be able to edit directly ;) Right now I'm using a trick for Point, with the default nova Place field and hidden latitude and longitude fields. For Polygons I will do it by hand in Database for the moment. Thanks anyway for publishing this Map field !

vesper8 commented 3 years ago

Map was blank for me using 0.0.8

Adding ->height('300px') made the maps appear... maybe this should be there by default?