Code Monkey home page Code Monkey logo

Comments (40)

star-andy avatar star-andy commented on May 27, 2024 1

实在不好意思 感谢你耐心的帮助

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

更新到 0.1.6 版本解决该问题

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

更新的到0.1.6覆盖物不见了
image

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

新版本更新了一个 prop,把 point 换成了 position,更符合百度地图文档中的语义。

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

另外多边形的 points 也换成了 path,这个是一开始没考虑好命名造成的问题,现在已经稳定。

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

image
是这个位置换成position了吗?

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

是的

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

更换了后还是没有marker,已经拉了你的最新的0.1.6
image

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

复现不了你的问题,看起来像是又把异步流程写成同步的了。最好提供完整的相关源码。

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

实在很尴尬

<template>
    <el-form :data="data" label-width="100px" style="margin:20px;width:90%;min-width:500px;">
        <el-form-item label="场馆名称" style="width:60%;min-width:500px;">
            <el-input v-model="data.name"></el-input>
        </el-form-item>
        <el-form-item label="是否启用" prop="delivery">
            <el-switch on-text="" off-text="" v-model="value"></el-switch>
        </el-form-item>
        <el-form :inline="true" style="margin-left: 100px;width:60%;min-width:500px;">
            <el-form-item>
                <el-input width="10" v-model="keyWords" placeholder="关键字"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" v-on:click="">搜索</el-button>
            </el-form-item>
        </el-form>
        <el-form-item label="地图">
            <baidu-map class="map" :center="{lng: lng, lat:lat}" :zoom="16" @ready="loadMap">
                <bm-view style="position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px"></bm-view>
                <bm-marker :position="{lng:lng, lat:lat}" :dragging="true" animation="BMAP_ANIMATION_BOUNCE" :label="{content: data.name, opts: {offset: {width: 20, height: -10}}}" @dragend="dragend"></bm-marker>
                <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT" :showAddressBar="true" :autoLocation="true" />
                <bm-navigation anchor="BMAP_ANCHOR_TOP_LEFT" />
               <!--  <bm-local-search :keyword="keyWords" :auto-viewport="true" @resultshtmlset=""></bm-local-search> -->
            </baidu-map>
        </el-form-item>
    </el-form>
</template>
<script>
export default {
    data() {
            return {
                value: true,
                data: {},
                keyWords: '',
                lng: '',
                lat: '',
            }
        },
        methods: {
            searchMap: function() {

            },
            loadMap: function() {
                var map = this.data.location.split(',');
                this.lat = map[0];
                this.lng = map[1];
            },
            dragend: function(type, target, pixel, point) {
                console.log(type + "----" + target + "----" + pixel + "----" + point);
            }

        },
        mounted() {
            console.log(this.$route.query.venueData);
            this.data = JSON.parse(this.$route.query.venueData);
            this.value = this.data.inUse == 1 ? true : false;
            console.log(this.lat + "---" + this.lng);
        }
}
</script>

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

大哥你又在mounted里修改data了啊😂 咱昨天刚说完组件渲染是异步的。。。 #14

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024
methods: {
            searchMap: function() {

            },
            loadMap: function() {
                var map = this.data.location.split(',');
                this.lat = map[0];
                this.lng = map[1];
            },
            dragend: function(type, target, pixel, point) {
                console.log(type + "----" + target + "----" + pixel + "----" + point);
            }

        }

我这个取值是在mounted里面 但是给map赋值的时候不是在mounted里面,这样也不行? 不过我这样写昨天是可以出来marker的

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

不可以,我要把这个事写进文档,而且用粗体标注。。。多谢反馈

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024
export default {
    data() {
            return {
                value: true,
                data: {},
                keyWords: '',
                lng: '',
                lat: '',
            }
        },
        methods: {
            searchMap: function() {

            },
            loadMap: function() {
                console.log(this.$route.query.venueData);
                this.data = JSON.parse(this.$route.query.venueData);
                this.value = this.data.inUse == 1 ? true : false;
                console.log(this.lat + "---" + this.lng);
                var map = this.data.location.split(',');
                this.lat = map[0];
                this.lng = map[1];
            },
            dragend: function(type, target, pixel, point) {
                console.log(type + "----" + target + "----" + pixel + "----" + point);
            }

        },
        mounted() {

        }
}

我这么写也不行 如果是异步渲染我正常只要在loadMap里面给这个绑定的经纬度赋值就行了 不需要把其它值的处理也放在这里面呢 不过我现在都放过来了 也没有marker

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

我把你的源码里的 this.data = JSON.parse(this.$route.query.venueData); mock 为 this.data = {inUse: 1} 一下就跑通了,完全复现不了你的问题。检查一下你的数据吧。

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

我先开会 会后研究下看看 谢谢了

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024
methods: {
            searchMap: function() {

            },
            loadMap: function() {
                console.log(this.$route.query.venueData);
                this.data = JSON.parse(this.$route.query.venueData);
                this.value = this.data.inUse == 1 ? true : false;
                console.log(this.lat + "---" + this.lng);
                console.log("=====")
                console.log(this.data)
                // var map = this.data.location.split(',');
                // this.lat = map[0];
                // this.lng = map[1];
            },
            dragend: function(type, target, pixel, point) {
                console.log(type + "----" + target + "----" + pixel + "----" + point);
            }

        },

我把这个赋值注释掉就能显示出来marker
但是地图就出问题
image

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

如果打开地图是正常的 但是不显示marker 我昨天像你说的改成在ready方法里面处理经纬度可以正常 但是今天你更新了组件的版本就不行了

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024
methods: {
            searchMap: function() {

            },
            loadMap: function() {
                console.log(this.$route.query.venueData);
                this.data = JSON.parse(this.$route.query.venueData);
                this.value = this.data.inUse == 1 ? true : false;
                console.log(this.lat + "---" + this.lng);
                console.log("=====")
                console.log(this.data)
                var map = this.data.location.split(',');
                // this.lat = map[0];
                // this.lng = map[1];
                 this.lat = '39.915';
                this.lng = '116.404';

            },
            dragend: function(type, target, pixel, point) {
                console.log(type + "----" + target + "----" + pixel + "----" + point);
            }

        },

写成固定的值也不行,还是没有marker
image

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

你文档上的固定值 应该是***
this.lat = '39.915';
this.lng = '116.404';

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

我把这个赋值注释掉就能显示出来marker
但是地图就出问题

我是给你打个比方,你地图出问题是因为数据里没有经纬度,警告里写的很清楚。

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

是的 确实是这个问题 但是我已经是在ready的方法里面复制了 为什么还赋值不上呢? 实在找不到原因了

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

更新到 0.1.7 试试吧

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

这回可以了 是什么问题呢?

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

太急,上一个版本没编译就 publish 了

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

sorry 现在拖动还是不好使

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

只是marker出来

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

image

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

你先把固定数据调通了再提新的 issue 吧。。。

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

我觉得有必要给 marker 的双向绑定写个文档了,等有空的时候搞一下。

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

我现在传值过来的经纬度显示和marker的显示都没问题了 但是拖动marker的回调还是没有
这是打印结果。
image

vue的百度组件好像都没有 所以还是感谢你能写这个组件出来

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

console.log(type + "----" + target + "----" + pixel + "----" + point); 你这行。。。把参数隐式转换成字符串了啊😂

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

我单独打印一个不加“----” 也是undefined

from vue-baidu-map.

shalldie avatar shalldie commented on May 27, 2024

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

事件只有一个参数,你打印了四个,剩下3个当然是 undefined 了😅

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

dragend event{type, target, pixel, point} 拖拽结束时触发此事件
这个不是四个参数吗?

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

image

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

这明明就是一个 event 参数嘛……………………

from vue-baidu-map.

star-andy avatar star-andy commented on May 27, 2024

。。。。。java写多了 见谅 丢人啊

from vue-baidu-map.

Dafrok avatar Dafrok commented on May 27, 2024

没事。。bug解决了就好

from vue-baidu-map.

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.